Javascript DropDown Menu

Question

Je cherchais à mettre en œuvre menu telles que

http://www.fogcreek.com/FogBugz/learnmore.html (côté gauche de la main)

Quelqu'un peut-il reprendre certains plug-in pour jquery, ou toute autre bibliothèque JavaScript qui se comportent comme ci-dessus site?

Answer 1

J'avais essayé le plugin jquery, il ne correspond pas à mes besoins.

Cependant, je suis capable de faire cela fonctionne, en copiant JS et CSS à partir d'autres sites:

http://jstock.sourceforge.net/features.html

Answer 2

jQuery Accordion fait cela.

Vous pouvez utiliser ce code (à partir de la page Accordéon jQuery) pour l'essayer:

Head:

<script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script> 
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script> 
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.accordion.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
$("#accordion").accordion(); 
}); 
</script> 

Corps:

<div id="accordion"> 
    <h3><a href="#">Section 1</a></h3> 
    <div>Mauris mauris ante</div> 
    <h3><a href="#">Section 2</a></h3> 
    <div>Sed non urna</div> 
    <h3><a href="#">Section 3</a></h3> 
    <div>Nam enim risus </div> 
    <h3><a href="#">Section 4</a></h3> 
    <div>Cras dictum</div> 
</div> 

Answer 3

En utilisant jQuery, j'ai ce script que j'utilise:

$(document).ready(function() { 
    $(".nav > li > a").click(function() { 
     $("ul", $(this).parent()).slideToggle("normal"); 
     return false; 
    }); 
    $(".nav ul").hide(); // Hide all on load. Done here rather than in CSS so users 
    // see the menu if they have javascript disabled. 
}); 

Le menu est marqué en HTML sous la forme:

<ul class="nav"> 
    <li><a href="#">Header</a></li> 
    <li> 
      <ul> 
       <li>Sub list Items</li> 
       <!-- More --> 
      </ul> 
    </li> 
</ul> 

pour chaque section expansible.

Answer 4

JQuery a plusieurs plug-ins de menu

• http://css-tricks.com/simple-jquery-dropdowns/
• http://www.sitepoint.com/blogs/2009/03/31/make-a-mega-drop-down-menu-with-jquery/
• http://www.search-this.com/2009/03/17/jquery-dropdown-menu/
• http://css-tricks.com/simple-jquery-dropdowns/

Il y a plus. J'ai écrit le mien pour mon site web. C'est très facile avec jQuery.