Geek asks and answers

Find string on page (Ctrl + F) when using jQuery accordion

I am using the jQuery accordion plugin to collapse a large page. It works great and is great for compacting a page, but I noticed that when searching for the browser search function (Ctrl + F) it only appears in the search box that opens div.

Is there any way to get the browser to search for everything div(and maybe even open them if they are found) ... It is clear why this is not trivial. A search would have to open divto show results, and this is not obvious ...

If there is no obvious way around this, what would be the approach to this programming programming?

Any ideas?

+5
source share
2

, :

Link Button

, Ctrl + F.

0

, , "" . , , .

,

$(document).on("keydown", function (e) { if (e.keyCode == 70 && e.ctrlKey) { ... } });

Ctrl f .

, , ( : 1 div, -, , - ), select . , DOM (, http://mark.koli.ch/2009/09/use-javascript-and-jquery-to-get-user-selected-text.html), , .

, !

, , ctrl-f.

HTML :

<div class="booklet">
   <h1>Header 1</h1>
   <div>Content in this flap</div>
   <h1>Header 2</h1>
   <div>Content in this flap</div>
   <h1>Header 3</h1>
   <div>Content in this flap</div>
</div>

h1 , , , cursor: pointer background-color, , , :

.booklet h1
{
   cursor:pointer;
   background-color:#3cf;
   color:white;
   border-top-left-radius:5px;
   border-top-right-radius:5px;
   padding:5px;
}
.booklet div
{
   display:none;
   border: 1px solid #3cf;
   border-bottom-left-radius:5px;
   border-bottom-right-radius:5px;
   padding:5px;
}

Javascript:

$('.booklet').on("click", "h1", function()
{
   $('.booklet div').hide();
   $(this).next("div").show(); // acts like accordion, animate to taste
});
$('.booklet div').first().show(); // open first flap of accordion to begin

$(document).on("keydown", function (e)
{
   if (e.keyCode == 70 && e.ctrlKey) // ctrl+f
   {
      $('.booklet div').show(); // show all flaps
   }
});

, , .

+6

More articles:


All Articles