Question

当鼠标悬停在主项目上时，我想显示菜单项列表，同时隐藏之前显示的项目。但效果并没有变得有效。我想下面的jquery代码是不正确的做我想要的。谢谢。

<html>
<head>
  <script type="text/javascript" src="jquery-1.7.1.min.js"></script> 
  <script type="text/javascript">
      $(document).read(function(){
         $("MainMNItem:not(:first)").hide();
         $("MainMNItem a").mouseover(function()
         {
             $("Item:visible").slideUp("slow");
             $(this).parent().next().slideDown("slow");
         });
      });
  </script> 
  <style>
     body{font-family:"Times New Roman"; font-size:16px;}
     Menu{width:330px;}
     Item a{color:#000;}
     Item{margin:0;}
     MainMNItem{background:#f11;font-size:18px;padding:5px;width:330px;} 
     MainMNItem a{color:#fff;}
     ul{list-style:none;padding:5px;}
  </style>  
</head>
<body>
   <Menu>
       <MainMNItem><a href="#">Home</a></MainMNItem> 
       <Item>
           <ul>
               <li><a href="#">Index</a></li>
               <li><a href="#">Documents</a></li>
           </ul>
       </Item>
       <MainMNItem><a href="#">About Us</a></MainMNItem>
       <Item>
           <ul>
               <li><a href="#">History</a></li>
               <li><a href="#">Contact</a></li>
           </ul>
       </Item>
   </Menu>
</body>
</html>

Answer 1

首先它应该是 $(document).ready(function(){ ... }); 不是read()。如果您需要任何帮助，请提供更好更准确的解释！

在jquery中显示具有基本鼠标悬停事件的菜单

1 个答案: