Dit is een zeer korte post van hoe we een geanimeerd navigatie menu met jQuery gemakkelijk tot stand brengen zonder plugin. U moet gezien hebben horizontale of veritical navigatie menu's die zet uit en krimpt de grootte op kantelen. Voordat deze javascript kader kwamen, moesten we heel wat code doen om de dingen gedaan. Waarom? Dat stomme cross browser gebruik. Ik wil niet opnieuw te beginnen op IE.

Ok, hier is het ding. We zijn gewoon met behulp van een ongeordende lijst om een ​​horizontaal menu dat krimpt en zet uit te maken. Code is doodsimpel. Laten we eerst kijken naar de opmaak.

  <div id="navcontainer">
 <ul id="navlist">
	 <li> <a href="http://www.google.com"> Google </ a> </ li>
	 <li> <a href="http://www.yahoo.com"> Yahoo </ a> </ li>
	 <li> <a href="http://www.msn.nl"> MSN </ a> </ li>
	 <li> <a href="http://www.lycos.com"> Lycos </ a> </ li>
	 <li> <a href="http://www.baidu.com"> Baidu </ a> </ li>
 </ Ul>
 </ Div> 

Dus hebben we een aantal lijstitems daar. Dus ze te laten verschijnen, zoals horizontale menu zouden we nodig hebben css, die er als volgt uitziet

 : inline ; } #navcontainer ul li li {display: inline;} # navcontainer ul li 

En het laatste deel .. Het maken van deze dans op mouseover. Heel eenvoudig met de levende functie. Slechts enkele van deze regels onder zal het lukken. Neem een ​​kijkje.

	 ( ) { $ ( "#navlist $ (Function () {$ ("# navlist 

Dat is het! Bekijk het in actie