10 个非常酷的基于jQuery的菜单效果插件

jopen 12年前
     <p>除了直观的界面效果外,炫酷的网站导航菜单或右键菜单也能为访问者带来眼前一亮的感觉。本文为你带来10个非常酷的基于jQuery的菜单效果插件。 <br /> <br /> <strong>1.  右击菜单</strong> <br /> <br /> 一个创建右击菜单的插件,简洁且易用。 <br /> </p>    <div style="text-align:center;">     <img alt="10 个非常酷的基于jQuery的菜单效果插件 " src="https://simg.open-open.com/show/8caa44b235f4381125be24b295dab9dd.jpg" width="580" height="150" />    </div>    <p><br /> <br /> <a href="/misc/goto?guid=4958319615832702898" target="_blank">源码/演示</a> <br /> <br /> <strong>2.  jQuery多级菜单——FX CSS菜单与子菜单</strong> <br /> <br /> 使用CSS创建菜单,使用JavaScript展示效果。特点如下: <br /> </p>    <ul>     <li>跨浏览器,兼容所有浏览器(包括IE6)。 </li>     <li>效果:在鼠标经过和子菜单展开时,具有平滑的淡入淡出效果。 </li>     <li>易于设置:简单的、用于无限级别菜单项目的嵌套无序列表。 </li>    </ul>    <div style="text-align:center;">     <img alt="10 个非常酷的基于jQuery的菜单效果插件 " src="https://simg.open-open.com/show/f1e0ae7090114cc3eb507a510c278db4.jpg" width="580" height="150" />    </div>    <p><br /> <br /> <a href="/misc/goto?guid=4958319616698362268" target="_blank">源码/演示</a> <br /> <br /> <strong>3.  jQuery菜单效果插件</strong> <br /> <br /> 另一个jQuery插件,通过它设计人员无需编写代码,即可创建动态的菜单效果。该插件为设计师提供了非常特别的效果。 <br /> </p>    <div style="text-align:center;">     <img alt="10 个非常酷的基于jQuery的菜单效果插件 " src="https://simg.open-open.com/show/9520262ea796c5ff357db63d871d3bbf.jpg" width="580" height="150" />    </div>    <p><br /> <br /> <a href="/misc/goto?guid=4958319617488749756" target="_blank">源码</a> / <a href="/misc/goto?guid=4958319618268929416" target="_blank">演示</a> <br /> <br /> <strong>4.  引人注目的jQuery菜单淡入淡出效果</strong> <br /> <br /> 这不仅仅是一个简单的淡入淡出效果,它需要大量的CSS和图像,但效果非常漂亮。 <br /> </p>    <div style="text-align:center;">     <img alt="10 个非常酷的基于jQuery的菜单效果插件 " src="https://simg.open-open.com/show/6b3ff3a53e761bccd7da86fcba77ca7c.jpg" width="580" height="150" />    </div>    <p><br /> <br /> <a href="/misc/goto?guid=4958319619044972633" target="_blank">源码</a> / <a href="/misc/goto?guid=4958319619828734632" target="_blank">演示</a> <br /> <br /> <strong>5.  使用jQuery创建一个滑动菜单</strong> <br /> <br /> 你是否想将曾经看过的优秀的jQuery导航据为己有?现在,你也可以实现它们,只需创建一个菜单,然后使用一些滑动效果让它动起来。 <br /> </p>    <div style="text-align:center;">     <img alt="10 个非常酷的基于jQuery的菜单效果插件 " src="https://simg.open-open.com/show/30fa9bf1f22f531fa331535f608cbf3f.jpg" width="580" height="150" />    </div>    <p><br /> <br /> <a href="/misc/goto?guid=4958186527904783000" target="_blank">源码</a> / <a href="/misc/goto?guid=4958186529974013514" target="_blank">演示</a> <br /> <br /> <strong>6.  基于jQuery的动画菜单</strong> <br /> <br /> 了解如何创建一个动画菜单(和<a href="/misc/goto?guid=4958319622049714141" target="_blank">Dragon Interactive网站</a>的菜单非常相似)。 <br /> </p>    <div style="text-align:center;">     <img alt="10 个非常酷的基于jQuery的菜单效果插件 " src="https://simg.open-open.com/show/25798464a8f957038ee1d62c89efeb1c.jpg" width="580" height="150" />    </div>    <p><br /> <br /> <a href="/misc/goto?guid=4958186664545153767" target="_blank">源码</a> / <a href="/misc/goto?guid=4958186666625386886" target="_blank">演示</a> <br /> <br /> <strong>7.  基于jQuery的叠加效果菜单</strong> <br /> <br /> 创建一个简单的菜单,鼠标悬停在它上面时,网页中其他元素的颜色都会暗下来。菜单部分将醒目显示,并展开子菜单。该效果使用jQuery创建。 <br /> </p>    <div style="text-align:center;">     <img alt="10 个非常酷的基于jQuery的菜单效果插件 " src="https://simg.open-open.com/show/8dcce8cb43f7e2ba79b43691af5add33.jpg" width="580" height="150" />    </div>    <p><br /> <br /> <a href="/misc/goto?guid=4958186574991235284" target="_blank">源码</a> / <a href="/misc/goto?guid=4958186577092532056" target="_blank">演示</a> <br /> <br /> <strong>8.  淡入淡出菜单</strong> <br /> <br /> 在本教程中,将学习如何创建淡入淡出效果菜单。 <br /> </p>    <div style="text-align:center;">     <img alt="10 个非常酷的基于jQuery的菜单效果插件 " src="https://simg.open-open.com/show/36c799e758f582e75e96cd21be00b954.jpg" width="580" height="150" />    </div>    <p><br /> <br /> <a href="/misc/goto?guid=4958317613745368870" target="_blank">源码</a> / <a href="/misc/goto?guid=4958319626443365665" target="_blank">演示</a> <br /> <br /> <strong>9.  使用jQuery实现逼真的悬停效果</strong> <br /> <br /> 为图标链接添加一个上升的悬停效果,通过jQuery,该效果还可以在有反光和阴影的图标上实现。 <br /> </p>    <div style="text-align:center;">     <img alt="10 个非常酷的基于jQuery的菜单效果插件 " src="https://simg.open-open.com/show/8639a90dbd4bfeeefc160d1ba86f0061.jpg" width="580" height="150" />    </div>    <p><br /> <br /> <a href="/misc/goto?guid=4958188541702367870" target="_blank">源码</a> / <a href="/misc/goto?guid=4958319627946658538" target="_blank">演示</a> <br /> <br /> <strong>10.  滑动的顶部菜单</strong> <br /> <br /> 滑动菜单在一些空间有限的页面中非常实用。这是一个滑动的顶部菜单,可以通过开/关按钮或任何与类名相关的标签来控制滑出/隐藏。 <br /> </p>    <div style="text-align:center;">     <img alt="10 个非常酷的基于jQuery的菜单效果插件 " src="https://simg.open-open.com/show/2e2291d2adcb6ed70831c441e1aeb15c.jpg" width="580" height="150" />    </div>    <p><br /> <br /> <a href="/misc/goto?guid=4958319628728166800" target="_blank">源码</a> / <a href="/misc/goto?guid=4958319629515815013" target="_blank">演示</a> <br /> <br /> 英文原文:<a href="/misc/goto?guid=4958319630296822380" target="_blank">http://www.jquery4u.com/menus/10-jquery-cool-menu-effect-plugins/</a><br /> <br /> 本文转载自: <a href="/misc/goto?guid=4958319631076227346" rel="nofollow" target="_blank">http://www.iteye.com/news/23764</a> </p>