简单的jQuery左导航栏和页面选择效果

简单的jQuery左导航栏和页面选择效果
这是为了实现导航的左边并选择它,这个函数需要引用jQuery。

左侧导航:
衬衫

短袖衬衫
长袖衬衫
T恤
长袖T恤
毛衣

开襟毛衣
帽衫
运动衫
童装毛衣
裤子

短裤
休闲裤
牛仔裤
穿卡其裤

JS代码:

等待加载的DOM元素。
$(文档)Ready(函数(){)
$(。一级>)。Click(function(){)
$(这)。AddClass(流) / /添加电流风格的元素
(下一步)((显示)/显示元素
。父母(兄弟姐妹)(儿童)(),RemoveClass(流) / /兄弟元素的父元素的子元素删除当前风格
(下一步)(隐藏);隐藏的下一个元素
返回false;
});
});

重新设置/ **
体{ margin: 0;padding: 0 0 12px 0;字体大小:12px;线高度:22px;字体: 5b8b 4f53
形式、UL、李、P、H1、H2、H3、H4、H5、H6 { margin: 0;padding: 0;}。
输入,选择{字体大小:12px;线高度:16px;}
img {边界:0;}
列表样式类型:无;}
一个{颜色:# 00007f;文字装饰:无;}
答:悬停{颜色:# bd0a01;文字装饰:下划线;}

{。箱
宽度:150px;
保证金:0汽车;
}
菜单{。
溢出:隐藏;
边框颜色:# c4d5df;
边框样式:实心;
边框宽度:0 1px 1px;
}
LV1 / * * /
菜单li.level1一{。
显示块;
身高:28px;
行高:28px;
背景:# ebf3f8;
字体重量:700;
颜色:# 5893b7;
文本缩进:14px;
边境上:1px solid # c4d5df;
}
li.level1。菜单:悬停{文字装饰:无;}
。菜单li.level1 a.current {背景:# b1d7ef;}
LV2 / * * /
菜单:溢出:隐藏;}
。菜单里的UL。2 {显示:无;}
。菜单里ul.level2李{
显示块;
身高:28px;
行高:28px;
背景:# ffffff;
字体重量:400;
颜色:# 42556b;
文本缩进:18px;
边境上:0px固体# ffffff;
溢出:隐藏;
}
。菜单里ul.level2李:悬停{
颜色:# F60;
}

$(文档)Ready(函数(){)
$(。2)。每个(函数(){)
$ = $(this);
如果($这{ 0 }。href = =字符串(窗口位置)){
this.addclass美元(悬停);
}
});
});
免责声明:本网信息来自于互联网,目的在于传递更多信息,并不代表本网赞同其观点。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,并请自行核实相关内容。本站不承担此类作品侵权行为的直接责任及连带责任。如若本网有任何内容侵犯您的权益,请及时联系我们,本站将会在24小时内处理完毕。
相关文章
返回顶部