本文实例讲述了jQuery实现仿美橙互联两级导航菜单的方法。分享给大家供大家参考。具体实现方法如下:
代码如下:
仿美橙互联导航菜单
首页
欢迎访问美橙互联!
特惠套餐
href="#">电信套餐 |
href="#">双线套餐
域名频道
英文域名
| 中文域名
| 通用网址 |
价格列表
| 域名交易
| 相关帮助
| 智能加速
var site_url = window.location.href.toLowerCase();
switch (true) {
default :
$("#nav li").attr("class","");
$("#nav li").eq(0).attr("class","nav_lishw");
$(".nav_lishw .v a").attr("class","sele");
$(".nav_lishw .kind_menu").show();
}
$("#nav li").hover(
function(){
clearTimeout(setTimeout("0")-1);
$("#nav .kind_menu").hide();
$("#nav li .v .sele").attr("class","shutAhover");
$(this).attr("id","nav_hover")
$("#nav_hover .v a").attr("class","sele");
$("#nav_hover .kind_menu").show();
},
function(){
if($(this).attr("class") != "nav_lishw"){
$("#nav_hover .v .sele").attr("class","");
$("#nav_hover .kind_menu").hide();
}
$(this).attr("id","")
$("#nav li .v .shutAhover").attr("class","sele");
setTimeout(function(){
$(".nav_lishw .kind_menu").show();
$(".nav_lishw .v a").attr("class","sele");
},50);
}
);
希望本文所述对大家的jQuery程序设计有所帮助。