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 src1="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="#">我的订单</a></li>
- <li class="fli" id="myaccound">
- <a href="#">我的宜美惠▼</a>
- <ul id="menu_1" style="display:none;">
- <li><a href="#">我的优惠券</a></li>
- <li><a href="#">收藏夹</a></li>
- <li><a href="#">短信息</a></li>
- </ul>
- </li>
- <li class="fli"><a href="#">我网站导航▼</a></li>
- </ul>
- </div>
- </body>
- </html>
来源: https://www.oschina.net/code/snippet_2887409_58737