本文实例讲述了jQuery实现的简洁下拉菜单导航效果。分享给大家供大家参考。具体如下: 这里使用jQuery实现简洁下拉菜单导航效果,代码规范,兼容性方面:支持 IE6+, Firefox 1.5+, Opera 8+, Safari 3+, Chrome 0.2+。简洁明快的jquery网站菜单,请参阅代码。 运行效果截图如下:在线演示地址如下: http://demo.jb51.net/js/2015/jquery-simple-down-show-menu-nav-codes/ 具体代码如下:jQuery下拉菜单导航body{background: #6595...
本文实例讲述了jquery实现平滑的二级下拉菜单效果。分享给大家供大家参考。具体如下: 这是一款使用了jQuery实现的二级菜单特效,灰色风格,颜色自己不喜欢的就自己动动手吧,CSS代码经过了优化,水平高的自己拿出修改吧,这是一个在国外前端设计网站找到的导航菜单效果,希望大家喜欢。 运行效果截图如下:在线演示地址如下: http://demo.jb51.net/js/2015/jquery-soft-2level-menu-nav-codes/ 具体代码如下:jquery平滑二级下拉...
本文实例讲述了JavaScript实现带箭头标识的多级下拉菜单效果。分享给大家供大家参考。具体如下: 这是一个支持多级显示的JS菜单,鼠标移向带有小三角的菜单项,可下拉出二级子菜单项,在该主菜单的上方会显示标记,指引当前的位置,本菜单代码使用了一个JS类,可根据代码地址自行下载,这个菜单未在网上测试,用在自己的网站里可能要修改代码。 运行效果截图如下:在线演示地址如下: http://demo.jb51.net/js/2015/js-focus-m-sel...
本文实例讲述了JavaScript实现非常简单实用的下拉菜单效果。分享给大家供大家参考。具体如下: 这是一款实用的JS下拉菜单,鼠标移上菜单就显示出二级菜单,是从其它网站上整理下来的,修改花了不少时间,现在去除了一些无用代码,更简洁了,而且代码兼容性似乎也表现不错,这款两级下拉菜单,基本是由CSS和JavaScript共同实现的,真的挺简洁实用。 运行效果截图如下:在线演示地址如下: http://demo.jb51.net/js/2015/js-css-down...
本文实例讲述了jquery实现漂亮的二级下拉菜单代码。分享给大家供大家参考。具体如下: 这里介绍一款基于jquery实现的网站下拉菜单,黑色风格,很漂亮,本菜单需要点击主菜单后的小三角符号才下拉出二级菜单,并不是有些菜单,是鼠标移上主菜单的时候就滑过,至于哪一种,就看个人的喜好了 先来看看运行效果:在线演示地址如下: http://demo.jb51.net/js/2015/jquery-bg-2-level-down-show-menu-codes/ 具体代码如下:jQuery二级菜...
本文实例讲述了js实现带圆角的多级下拉菜单效果。分享给大家供大家参考。具体如下: 这是一款酷黑的圆角多级下滑菜单,可支持三级,鼠标放上后可见到滑出的菜单,调用了一个JS封装库,代码有些复杂,有兴趣的可研究。 运行效果截图如下:在线演示地址如下: http://demo.jb51.net/js/2015/js-down-show-menu-style-codes/ 具体代码如下:下拉菜单 .imcm ul,.imcm li,.imcm div,.imcm span,.imcm a{text-align:left;vertical-align:...
本文实例讲述了jQuery实现多级下拉菜单jDropMenu的方法。分享给大家供大家参考。具体如下: 这里介绍的jQuery多级下拉菜单导航-多级下拉菜单,英文名叫 DropDown Menu。通过 each() 遍历添加相应的处理事件 mouseover,mouseout 和 tab 操作的支持。这个效果是我们平时最常见的一个效果之一,也是一个十分实用的一个 JavaScript 特效。例如我的 BlueNight 主题的主导航就使用了多级下拉菜单的这个效果。 运行效果截图如下:在线演示...
本文实例讲述了js+CSS实现模拟select控件的下拉菜单效果。分享给大家供大家参考。具体如下: 这是一个JS+CSS技术实现的Select控件效果,模拟出来的,比默认的Select更漂亮,有了这个模板,你修改Select就更方便了,由此你也可以将其制作成CSS下拉菜单,在兼容性方面暂未测试,在IE8下没问题。 运行效果截图如下:在线演示地址如下: http://demo.jb51.net/js/2015/js-css-select-control-style-codes/ 具体代码如下:模拟select控件...
本文实例讲述了js实现简洁大方的二级下拉菜单效果代码。分享给大家供大家参考。具体如下: 这是一款简洁大方的二级下拉菜单,菜单的颜色自己根据需要重新定义吧,这里仅给大家提供一种制作二级菜单的思路,整体效果看上去相当实用,下拉导航菜单也是大家比较常用的。 运行效果截图如下:在线演示地址如下: http://demo.jb51.net/js/2015/js-simple-2level-show-down-menu-codes/ 具体代码如下:简洁大方的二级下拉菜单*{margin:0;...
本文实例讲述了jQuery实现灰蓝风格标准二级下拉菜单效果代码。分享给大家供大家参考。具体如下: 这是一款基于jQuery实现的标准型二级菜单,是漂亮的灰-蓝风格下拉级联菜单,代码经过了完美修正,目前兼容性已经很不错了,甚至不用修改,拷贝代码你就可以用了。 运行效果截图如下:在线演示地址如下: http://demo.jb51.net/js/2015/jquery-blue-color-style-nav-menu-codes/ 具体代码如下:jQuery标准型二级菜单body {margin:0; p...
本文实例讲述了js实现点击向下展开的下拉菜单效果代码。分享给大家供大家参考。具体如下: 这里介绍js实现点击向下展开的下拉菜单特效代码,无调用jQuery,真正的JS下拉菜单,兼容性方面未做测试,觉得有用处的自己测试修正吧,本文仅提供基础的代码供参考。 运行效果截图如下:在线演示地址如下: http://demo.jb51.net/js/2015/js-click-show-down-menu-style-codes/ 具体代码如下:下拉菜单*{margin:0; padding:0} #nav{width:2...
本文实例讲述了js+css实现超简洁的二级下拉菜单效果代码。分享给大家供大家参考。具体如下: 这是一个很简洁的CSS+JavaScript二级菜单,没有使用过多的修饰素材,尽量不调用外部图片,简洁大方,而且便于二级开发完善,最初是一个政府网站上的菜单。 运行效果截图如下:在线演示地址如下: http://demo.jb51.net/js/2015/js-css-simple-2jxl-menu-style-codes/ 具体代码如下:二级下拉菜单/* #193B5F 栏目字体颜色 */ *{margin:0; ...
本文实例讲述了jquery实现简单的二级导航下拉菜单效果。分享给大家供大家参考。具体如下: jQuery代码实现的二级导航菜单效果,非常简洁,喜欢简洁风格的朋友您可以下载哦。菜单最多支持两级,CSS的配合也是挺重要的,不多说了,要代码的就直接复制吧。 运行效果截图如下:在线演示地址如下: http://demo.jb51.net/js/2015/jquery-2jxl-menu-codes/ 具体代码如下:jquery二级导航菜单.ddsmoothmenu {MARGIN: 0px auto; FONT: 12px...
本文实例讲述了js实现全国省份城市级联下拉菜单效果代码。分享给大家供大家参考。具体如下: 这是一个大家都知道的网页小功能,很常见,全国省份与城市级联菜单,采用Select下拉的方式选择数据,不过现在很多都Ajax了,貌似这种老形式已经过时了,不过在兼容性方面,仍然是不落后的。 运行效果截图如下:在线演示地址如下: http://demo.jb51.net/js/2015/js-conv-city-xl-menu-style-codes/ 具体代码如下:全国省份城市级联下拉菜...
本文实例讲述了JavaScript简单下拉菜单实例代码。分享给大家供大家参考。具体如下: 这是一款JavaScript实现的下拉菜单演示代码,带渐变效果的CSS+jQuery菜单,向下滑出型的菜单,最高支持两级,网上常见到的一种菜单风格,希望大家喜欢哦。 运行效果截图如下:在线演示地址如下: http://demo.jb51.net/js/2015/js-simple-xlcd-down-menu-codes/ 具体代码如下:JavaScript下拉菜单演示代码body {margin:25px; font:12px Verdana, ...