Jquery网站导航的普通下拉菜单

来源：互联网发布：js字符串长度格式化编辑：程序博客网时间：2024/06/05 03:16

<!doctype html>

<html lang="en"> <head>  <meta charset="UTF-8">  <meta name="Generator" content="EditPlus®">  <meta name="Author" content="">  <meta name="Keywords" content="">  <meta name="Description" content="">  <title>普通下拉菜单</title>   </head> <body>              <ul>      <li><a href="#" class="mainmenu" >Menu One</a></li>  <li class="submenu">   <a href="#">Link 1</a>               <a href="#">Link 2</a>   <a href="#">Link 3</a>   <a href="#">Link 4</a>  </li>   </ul>   <ul>      <li><a href="#" class="mainmenu" >Menu Two</a></li>  <li class="submenu">   <a href="#">Link 1</a>               <a href="#">Link 2</a>   <a href="#">Link 3</a>   <a href="#">Link 4</a>  </li>   </ul>         <script type="text/JavaScript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>  <script>     $(function(){ $('.mainmenu').mouseenter(function(){ $('.submenu').stop(false,true).hide();      var submenu=$(this).parent().next(); submenu.css({                position:'absolute',top:$(this).offset.top+$(this).height()+'px',left:$(this).offset.left+'px',zIndex:1000}); submenu.stop().slideDown(300); submenu.mouseleave(function(){                            $(this).slideUp(300);  }); }); });  </script> </body></html>

0 0

Jquery网站导航的 普通下拉菜单

Jquery网站导航的普通下拉菜单