14个漂亮的导航jQuery插件

     <h2>1.Facets Navigation</h2>    <p><a title="Facets Navigation" href="http://demo.tn34.de/jquery-plugins/facets/demo4.html?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="Facets Navigation" href="http://www.tn34.de/projekte/downloads/jQuery.tn34.facets.html?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Download</strong></span></a><br /> <a href="https://simg.open-open.com/show/133a7b0409972087aee8a813618b1ed4.jpg" rel="wp-prettyPhoto[g593]"><img style="width:644px;height:313px;" title="facets.jpg" border="0" alt="facets.jpg" src="https://simg.open-open.com/show/9b482df110bb3b79903de215fe9a0e45.jpg" width="700" height="525" /><br /> </a></p>    <h2><a href="https://simg.open-open.com/show/133a7b0409972087aee8a813618b1ed4.jpg" rel="wp-prettyPhoto[g593]"></a></h2>    <h2>2.Rocking & Rolling</h2>    <p><a title="Rocking & Rolling" href="http://tympanus.net/Tutorials/RockingRollingMenu/?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="Rocking & Rolling" href="http://tympanus.net/codrops/2010/04/30/rocking-and-rolling-rounded-menu-with-jquery/?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Download</strong></span></a></p>    <p><br /> <a href="https://simg.open-open.com/show/f45f235b462b83b76e733261261454f6.jpg" rel="wp-prettyPhoto[g593]"><img style="width:614px;height:319px;" class="aligncenter size-full wp-image-607" title="rocking-rolling" alt="rocking-rolling" src="https://simg.open-open.com/show/f45f235b462b83b76e733261261454f6.jpg" width="1152" height="368" /></a></p>    <h2>3.Garage Door Menu</h2>    <p><a title="Garage Door Menu" href="http://www.gayadesign.com/scripts/jquerygaragedoor/?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="Garage Door Menu" href="http://www.gayadesign.com/diy/jquery-convertion-garagedoor-effect-using-javascript/?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Download</strong></span></a></p>    <p><br /> <a href="https://simg.open-open.com/show/99ab680e452a7704b63ea9b36233070e.jpg" rel="wp-prettyPhoto[g593]"><img style="width:614px;height:319px;" class="aligncenter size-full wp-image-602" title="garage-door" alt="garage-door" src="https://simg.open-open.com/show/99ab680e452a7704b63ea9b36233070e.jpg" width="1152" height="377" /></a></p>    <h2>4.Little Boxes Menu</h2>    <p><a title="Little Boxes Menu" href="http://tympanus.net/Tutorials/LittleBoxesMenu/?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="Little Boxes Menu" href="http://tympanus.net/codrops/2010/05/18/little-boxes-menu-with-jquery/?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Download</strong></span></a></p>    <p><br /> <a href="https://simg.open-open.com/show/602219fbdb968664ec61c4f019de431c.jpg" rel="wp-prettyPhoto[g593]"><img style="width:614px;height:319px;" class="aligncenter size-full wp-image-605" title="little-boxes-menu" alt="little-boxes-menu" src="https://simg.open-open.com/show/602219fbdb968664ec61c4f019de431c.jpg" width="1152" height="522" /></a></p>    <h2>5.Cool Animated Menu</h2>    <p><a title="Cool Animated Menu" href="http://line25.com/wp-content/uploads/2011/animated-menu/demo/index.html?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="Cool Animated Menu" href="http://line25.com/tutorials/how-to-create-a-cool-animated-menu-with-jquery?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Download</strong></span></a></p>    <p><br /> <a href="https://simg.open-open.com/show/2f880e27ced954df4a76d1925f38d2cb.jpg" rel="wp-prettyPhoto[g593]"><img style="width:614px;height:319px;" class="aligncenter size-full wp-image-599" title="cool-animated" alt="cool-animated" src="https://simg.open-open.com/show/2f880e27ced954df4a76d1925f38d2cb.jpg" width="1152" height="308" /></a></p>    <h2>6.Apple Navigation</h2>    <p><a title="Apple Navigation" href="http://designindevelopment.com/demos/apple/?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="Navigation" href="http://designindevelopment.com/css/apple-navigation-with-css3/?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Download</strong></span></a></p>    <p><br /> <a href="https://simg.open-open.com/show/5d96c6320fc6f599c4cee50da8c1f700.jpg" rel="wp-prettyPhoto[g593]"><img style="width:614px;height:319px;" class="aligncenter size-full wp-image-595" title="apple-menu" alt="apple-menu" src="https://simg.open-open.com/show/5d96c6320fc6f599c4cee50da8c1f700.jpg" width="1008" height="404" /></a></p>    <h2>7.Jquery ListNav Plugin</h2>    <p><a title="Jquery ListNav Plugin" href="http://www.ihwy.com/Labs/Demos/Current/jquery-listnav-plugin.aspx?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="Jquery ListNav Plugin" href="http://www.ihwy.com/Labs/jquery-listnav-plugin.aspx?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Download</strong></span></a><br /> <a href="https://simg.open-open.com/show/4458ac6d3f2665a5feedead3e5099579.jpg" rel="wp-prettyPhoto[g593]"><img style="width:614px;height:319px;" class="aligncenter size-full wp-image-604" title="list-nav" alt="list-nav" src="https://simg.open-open.com/show/4458ac6d3f2665a5feedead3e5099579.jpg" width="1077" height="464" /></a></p>    <h2>8.Vimeo Top Navigation</h2>    <p><a title="Vimeo Navigation" href="/misc/goto?guid=4958193715478074486" target="_blank"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="Vimeo Navigation" href="http://www.jankoatwarpspeed.com/post/2009/01/19/Create-Vimeo-like-top-navigation.aspx?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Download</strong></span></a></p>    <p><br /> <a href="https://simg.open-open.com/show/d9899c90d32fd3c10d05507f1d4df7fc.jpg" rel="wp-prettyPhoto[g593]"><img style="width:614px;height:319px;" class="aligncenter size-full wp-image-608" title="vimeo-menu" alt="vimeo-menu" src="https://simg.open-open.com/show/d9899c90d32fd3c10d05507f1d4df7fc.jpg" width="1131" height="297" /></a></p>    <h2>9.Background Image Menu</h2>    <p><a title="Background Image Menu" href="http://tympanus.net/Tutorials/BeautifulBackgroundImageNavigation/?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="Background Image Menu" href="http://tympanus.net/codrops/2010/05/05/beautiful-background-image-navigation-with-jquery/?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Download</strong></span></a></p>    <p><br /> <a href="https://simg.open-open.com/show/2e448d3fc0b15f44cd5f228189b45ee0.jpg" rel="wp-prettyPhoto[g593]"><img style="width:614px;height:319px;" class="aligncenter size-full wp-image-596" title="background-image-menu" alt="background-image-menu" src="https://simg.open-open.com/show/2e448d3fc0b15f44cd5f228189b45ee0.jpg" width="1152" height="608" /></a></p>    <h2>10.Bottom Side out Menu</h2>    <p><a title="Bottom Side out Menu" href="http://www.tympanus.net/Tutorials/FreshBottomSlideOutMenu/?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="Bottom Side out Menu" href="http://tympanus.net/codrops/2010/03/09/a-fresh-bottom-slide-out-menu-with-jquery/?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Download</strong></span></a></p>    <p><br /> <a href="https://simg.open-open.com/show/2265ff2d2d5b448da402d1f5a8330417.jpg" rel="wp-prettyPhoto[g593]"><img style="width:614px;height:319px;" class="aligncenter size-full wp-image-597" title="bottom-sideout" alt="bottom-sideout" src="https://simg.open-open.com/show/2265ff2d2d5b448da402d1f5a8330417.jpg" width="1152" height="425" /></a></p>    <h2>11.JAWS</h2>    <p><a title="jaws" href="http://www.mitya.co.uk/scripts/Jaws-news-ticker-and-mini-accordion-139#part2?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="jaws" href="http://www.mitya.co.uk/scripts/Jaws-news-ticker-and-mini-accordion-139?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Download</strong></span></a></p>    <p><br /> <a href="https://simg.open-open.com/show/194953af5cdb8a0c7ddacc6a021e33b5.jpg" rel="wp-prettyPhoto[g593]"><img style="width:614px;height:319px;" class="aligncenter size-full wp-image-603" title="jaws" alt="jaws" src="https://simg.open-open.com/show/194953af5cdb8a0c7ddacc6a021e33b5.jpg" width="1064" height="375" /></a></p>    <h2>12.Nice Menu</h2>    <p><a title="Nice Menu" href="http://codecanyon.net/item/nice-menu-v10/full_screen_preview/135661?ref=dynamicwp?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="Nice Menu" href="http://codecanyon.net/item/nice-menu-v10/135661?ref=dynamicwp?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Purchase</strong></span></a></p>    <p><br /> <a href="https://simg.open-open.com/show/a22b47ac50e6070bfe6be2c8567cfe23.jpg" rel="wp-prettyPhoto[g593]"><img style="width:614px;height:319px;" class="aligncenter size-full wp-image-606" title="nice-menu" alt="nice-menu" src="https://simg.open-open.com/show/a22b47ac50e6070bfe6be2c8567cfe23.jpg" width="1136" height="584" /></a></p>    <h2>13.Float Menu</h2>    <p><a title="Float Menu" href="http://codecanyon.net/item/floatmenu/full_screen_preview/164109?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="Float Menu" href="http://codecanyon.net/item/floatmenu/164109?redirect_back=true&ref=1stwebdesigner&clickthrough_id=20953950?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Purchase</strong></span></a></p>    <p><br /> <a href="https://simg.open-open.com/show/e0adb522a98bee6937fcb8185b4b2dc0.jpg" rel="wp-prettyPhoto[g593]"><img style="width:614px;height:319px;" class="aligncenter size-full wp-image-601" title="float-menu" alt="float-menu" src="https://simg.open-open.com/show/e0adb522a98bee6937fcb8185b4b2dc0.jpg" width="1152" height="447" /></a></p>    <h2>14.Context Menu Class</h2>    <p><a title="Context Menu Class" href="http://codecanyon.net/item/context-menu-class/full_screen_preview/108671?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Demo</strong></span></a><span style="font-size:medium;"><strong> | </strong></span><a title="Context Menu Class" href="http://codecanyon.net/item/context-menu-class/108671?ref=1stwebdesigner?iframe=true&width=100%&height=100%" rel="wp-prettyPhoto"><span style="font-size:medium;"><strong>Purchase</strong></span></a></p>    <span style="font-size:medium;"><strong><a href="https://simg.open-open.com/show/95774b5ff14a1e4c158523f620a126e0.jpg" rel="wp-prettyPhoto[g593]"><img style="width:614px;height:319px;" class="aligncenter size-full wp-image-598" title="context-menu" alt="context-menu" src="https://simg.open-open.com/show/95774b5ff14a1e4c158523f620a126e0.jpg" width="1139" height="539" /></a></strong></span> 转自：http://bloggerspath.com/14-jquery-navigation-menu-for-your-websites/