这篇文章给大家介绍怎么在jQuery中使用复合事件,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。
具体如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>复合事件</title>
<style type="text/css" >
a{
color:#000;
text-decoration:none;
}
ul{
list-style:none;
}
ul li{
width:140px;
}
#menu_1{
border:1px dotted #666;
border-top:none;
padding:0px 5px 5px 5px;
}
#menu_1 li{
margin: 5px 0px;
}
li.fli{
display:block;
float:left;
padding:0px 10px;
}
</style>
<script src="js/jquery-1.8.3.js" type="text/javascript"></script>
<script language="JavaScript">
$(document).ready(function () {
$("#myaccound").hover(
function () {
$("#menu_1").css("display","block");
},
function () {
$("#menu_1").css("display","none");
});
});
</script>
</head>
<body>
<div id="nav">
<ul>
<li class="fli"><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >我的订单</a></li>
<li class="fli" id="myaccound">
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >我的宜美惠▼</a>
<ul id="menu_1" >
<li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >我的优惠券</a></li>
<li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >收藏夹</a></li>
<li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >短信息</a></li>
</ul>
</li>
<li class="fli"><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >我网站导航▼</a></li>
</ul>
</div>
</body>
</html>
运行效果图如下:
关于怎么在jQuery中使用复合事件就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。