jquery实现简单的二级导航下拉菜单效果_jquery
程序员文章站
2022-04-02 14:05:41
...
本文实例讲述了jquery实现简单的二级导航下拉菜单效果。分享给大家供大家参考。具体如下:
').prependTo($parentshadow).css({left:this._shadowoffset.x+'px', top:this._shadowoffset.y+'px'}) //insert shadow DIV and set it to parent node for the next shadow div
}
$curobj.hover(
function(e){
var $targetul=$(this).children("ul:eq(0)")
this._offsets={left:$(this).offset().left, top:$(this).offset().top}
var menuleft=this.istopheader? 0 : this._dimensions.w
menuleft=(this._offsets.left+menuleft+this._dimensions.subulw>$(window).width())? (this.istopheader? -this._dimensions.subulw+this._dimensions.w : -this._dimensions.w) : menuleft //calculate this sub menu's offsets from its parent
if ($targetul.queue().length\n'
+mainmenuid+', '+mainmenuid+' ul li a {background:'+setting.customtheme[0]+';}\n'
+mainmenuid+' ul li a:hover {background:'+setting.customtheme[1]+';}\n'
+'')
}
jQuery(document).ready(function($){ //override default menu colors (default/hover) with custom set?
if (typeof setting.contentsource=="object"){ //if external ajax menu
ddsmoothmenu.getajaxmenu($, setting)
}
else{ //else if markup menu
ddsmoothmenu.buildmenu($, setting)
}
})
}
} //end ddsmoothmenu variable
//Initialize Menu instance(s):
ddsmoothmenu.init({
mainmenuid: "smoothmenu1", //menu DIV id
customtheme: [], //override default menu CSS background values? Uncomment: ["normal_background", "hover_background"]
contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
})
jQuery代码实现的二级导航菜单效果,非常简洁,喜欢简洁风格的朋友您可以下载哦。菜单最多支持两级,CSS的配合也是挺重要的,不多说了,要代码的就直接复制吧。
运行效果截图如下:
在线演示地址如下:
http://demo.jb51.net/js/2015/jquery-2jxl-menu-codes/
具体代码如下:
jquery二级导航菜单
上一篇: linux下php验证码不显示怎么办
下一篇: 史上最高效的Python爬虫框架(推荐)
推荐阅读
-
jQuery插件FusionCharts实现的3D帕累托图效果示例【附demo源码】
-
PHP导航下拉菜单的实现如此简单
-
jQuery实现的导航条切换可显示隐藏
-
jQuery滚动监听实现商城楼梯式导航效果
-
jQuery插件FusionCharts实现的2D面积图效果示例【附demo源码下载】
-
jquery实现checkbox全选全不选的简单实例
-
jQuery插件HighCharts实现的2D面积图效果示例【附demo源码下载】
-
jQuery animate()实现背景色渐变效果的处理方法【使用jQuery.color.js插件】
-
jQuery插件HighCharts实现的2D条状图效果示例【附demo源码下载】
-
jQuery+Asp.Net实现省市二级联动功能的方法