本文实例讲述了jquery实现适用于门户站的导航下拉菜单效果代码。分享给大家供大家参考。具体如下： 这是一款应用了jQuery+CSS共同编写实现的网页导航菜单，采用浅蓝色的布局方式，整体格调淡雅清新，简洁大方，不失为一款好菜单。本特点的特点是兼容好，在火狐/IE下都有良好表现，而且在有二级子菜单的地方，主菜单上都会有一个小三角标识，很好的提升了用户体验，相信你也会喜欢的。运行效果截图如下： 在线演示地址如下： http:/...
本文实例讲述了jquery实现鼠标滑过显示二级下拉菜单效果。分享给大家供大家参考。具体如下： 这是一款jquery实现的下拉菜单，当鼠标移在主菜单上的时候，向下滑出二级子菜单，采用UL LI结构，便于修改完善，我觉得是很实用的菜单，希望大家平时能用得上。 运行效果截图如下：在线演示地址如下： http://demo.jb51.net/js/2015/jquery-mouse-over-show-menu-codes/ 具体代码如下：jquery下拉菜单* { margin: 0; padding: 0; } body ...
本文实例讲述了jQuery实现的fixedMenu下拉菜单效果代码。分享给大家供大家参考。具体如下： 这里演示了仿Google风格的下拉菜单，其核心实际上是jquery.fixedMenu菜单，使用了jquery.fixedMenu.js和fixedMenu_style.css文件，已在代码中加注释，你可以从本代码中分享现这两个文件，然后重新引用。本菜单在鼠标点击主菜单的时候可向下显示二级子菜单，在火狐或Chrome浏览器下，还可显示菜单阴影效果。 运行效果截图如下：在线演示地址...
本文实例讲述了jquery实现的淡入淡出下拉菜单效果。分享给大家供大家参考。具体如下： 这是一款jQuery带有淡入淡出效果的下拉菜单，可作为一个下拉导航菜单的模板，移动鼠标到一级主菜单上看一看，在有包括二级子菜单的菜单项上悬停时，二级菜单渐变显示出来，兼容性也是很不错的，希望大家喜欢哈。 运行效果截图如下：在线演示地址如下： http://demo.jb51.net/js/2015/jquery-fade-in-out-menu-style-codes/ 具体代码如下：jQuer...
本文实例讲述了jquery实现鼠标经过显示下划线的渐变下拉菜单效果代码。分享给大家供大家参考。具体如下： 这里介绍的是一款黑红带渐变的网站下滑导航菜单，基于jquery实现的下滑线导航菜单，鼠标经过主菜单的时候，下滑线就会自动跟向哪里，如果该菜单有两级子菜单，则同样会显示下滑菜单，带渐变效果。菜单操作很灵敏，使用有自定义的封装插件SuperSlide.2.1.js，所在使用时请自行下载这个JS插件。 运行效果截图如下：在线演示地址...
本文实例讲述了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平滑二级下拉...
本文实例讲述了jquery实现漂亮的二级下拉菜单代码。分享给大家供大家参考。具体如下： 这里介绍一款基于jquery实现的网站下拉菜单，黑色风格，很漂亮，本菜单需要点击主菜单后的小三角符号才下拉出二级菜单，并不是有些菜单，是鼠标移上主菜单的时候就滑过，至于哪一种，就看个人的喜好了 先来看看运行效果：在线演示地址如下： http://demo.jb51.net/js/2015/jquery-bg-2-level-down-show-menu-codes/ 具体代码如下：jQuery二级菜...
本文实例讲述了jQuery实现多级下拉菜单jDropMenu的方法。分享给大家供大家参考。具体如下： 这里介绍的jQuery多级下拉菜单导航-多级下拉菜单，英文名叫 DropDown Menu。通过 each() 遍历添加相应的处理事件 mouseover,mouseout 和 tab 操作的支持。这个效果是我们平时最常见的一个效果之一，也是一个十分实用的一个 JavaScript 特效。例如我的 BlueNight 主题的主导航就使用了多级下拉菜单的这个效果。 运行效果截图如下：在线演示...
本文实例讲述了jQuery实现灰蓝风格标准二级下拉菜单效果代码。分享给大家供大家参考。具体如下： 这是一款基于jQuery实现的标准型二级菜单，是漂亮的灰-蓝风格下拉级联菜单，代码经过了完美修正，目前兼容性已经很不错了，甚至不用修改，拷贝代码你就可以用了。 运行效果截图如下：在线演示地址如下： http://demo.jb51.net/js/2015/jquery-blue-color-style-nav-menu-codes/ 具体代码如下：jQuery标准型二级菜单body {margin:0; p...
本文实例讲述了jquery实现简单的二级导航下拉菜单效果。分享给大家供大家参考。具体如下： jQuery代码实现的二级导航菜单效果，非常简洁，喜欢简洁风格的朋友您可以下载哦。菜单最多支持两级，CSS的配合也是挺重要的，不多说了，要代码的就直接复制吧。 运行效果截图如下：在线演示地址如下： http://demo.jb51.net/js/2015/jquery-2jxl-menu-codes/ 具体代码如下：jquery二级导航菜单.ddsmoothmenu {MARGIN: 0px auto; FONT: 12px...
本文实例讲述了jQuery实现带动画效果的多级下拉菜单代码。分享给大家供大家参考。具体如下： 这是一款基于jQuery实现的多级下拉菜单，带动画效果，所有的元素以ul li ul li ul li的循环格式嵌套 如果没有下级分类 就用li a结束嵌套，代码内不用toggle()的原因是为了在收缩菜单的时候同时也将该菜单的下级菜单以后的所有元素都隐藏。 运行效果截图如下：在线演示地址如下： http://demo.jb51.net/js/2015/jquery-animate-style-down...
本文实例讲述了jQuery简单实现两级下拉菜单效果代码。分享给大家供大家参考。具体如下： 这是一款两级下拉菜单,jquery插件版，在IE6/IE7/IE8下运行良好，在本示例中，菜单仅显示了四组，不过原理是一样的，菜单较长的话直接复制其中一组就行了，直到满足你的应用。 运行效果截图如下：在线演示地址如下： http://demo.jb51.net/js/2015/jquery-simple-2l-slideout-menu-codes/ 具体代码如下：两级下拉菜单*{ margin:0px; padding:0...
二级联动下拉菜单选择应用在在很多地方，比如说省市下拉联动，商品大小类下拉选择联动。本文将通过实例讲解使用jQuery+PHP+MySQL来实现大小分类二级下拉联动效果。 实现效果：当选择大类时，小类下拉框里的选项内容也随着改变。 实现原理：根据大类的值，通过jQuery把值传给后台PHP处理，PHP通过查询MySQl数据库，得到相应的小类，并返回JSON数据给前端处理。 XHTML 首先我们要建立两个下拉选择框，第一个是大类，第二个是小类。大...
当要在一个有限的导航菜单空间放一个大的子菜单时，我们一般采用下拉菜单的形式来弥补空间的不足。本文将带大家用最少的时间，使用jQuery和CSS结合制作一个动态的下拉菜单。XHTML 首先是要在页面的head部分引入jquery库，这是必须的。接着我使用一个无序列表来构建菜单。首页 服务 案例 关于 BLOG 一目了然，看起来非常简洁，由于下拉菜单开始是关闭的，我还要建立一个可视的可触发下拉的按钮，本文为了方便直接使用了一张图片作为...