jquery(代码)

最新推荐文章于 2022-08-29 18:01:32 发布

乐乐de乐乐

最新推荐文章于 2022-08-29 18:01:32 发布

阅读量269

点赞数

本文链接：https://blog.csdn.net/qq_38177482/article/details/72845108

版权

简单程序代码：
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>bianse</title>

//添加CSS样式

/*#nav .navsBox ul{
display:none;
list-style:none;
}*/
#nav .navsBox ul li.onbg{
background-color:#F9DBD1;
}
</style>
<script type="text/javascript" src="jquery-3.2.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#nav .navsBox .firstNav").click(function(){
var $list = $("#nav .navsBox ul");
if($list.css("display") == "block")
$list.css("display","none");
else
$list.css("display","block");
});
$("#nav .navsBox ul li").mouseover(function(){
$(this).addClass("onbg"); //为该元素添加类样式.onbg
}).mouseout(function(){
$(this).removeClass("onbg");//为该元素移除类样式.onbg
});
});
</script>

</head>

<body>
<div id="nav">
<div class="navsBox">
<div class="firstNav">购物特权</div>
<ul>
<li class="gg"><a href="#"><img src="../Desktop/images/huan.gif" />全额兑换</a></li>
<li class="hh"><a href="#"><img src="../Desktop/images/you.gif" />俱乐部包邮卡</a></li>
<li class="dd"><a href="#"><img src="../Desktop/images/gouwu.gif" />购物领金币</a></li>
<li class="bb"><a href="#"><img src="../Desktop/images/meiri.gif" />每日领金币</a></li>
<li class="mm"><a href="#"><img src="../Desktop/images/zhe.gif" />VIP阶梯价</a></li>
</ul>
</div>
</div>

</body>
</html>

乐乐de乐乐

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
jquery(代码)

简单程序代码：bianse//添加CSS样式 /*#nav .navsBox ul{display:none;list-style:none; }*/#nav .navsBox ul li.onbg{background-color:#F9DBD1;}$(document).ready(function () {$("#nav
复制链接

扫一扫