当我使用鼠标div时，jquery的div show隐藏了

Question

  if ($("#example").mouseover) { $("#test").show(1500); } 

 #example{ width:350px; height:350px; background-color:black; } #test{ width:350px; height:350px; background-color:black; display:none; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script> <a id='example'>MENU</a> <div id="test"> <ul> <li>Item1</li> <li>Item1</li> </ul> </div> 

当单击链接时，我想显示一个div作为下拉菜单。 我在哪里做错了？

Answer 1

尝试这个：

#example{
    width:350px;
    height:350px;
    background-color:black;
}

#test{
    width:350px;
    height:350px;
    background-color:black;
    display:none;
}


<a id='example'>MENU</a>
<div id="test">
    <ul>
        <li>Item1</li>
        <li>Item1</li>
    </ul>
</div>

$("#example").mouseover(function() {
      $("#test").show('slow');
}).mouseout(function() {
      $("#test").hide('slow');
});

Answer 2

$(".example").on('mouseover',function(){
  $(".test").show(1500);
});

并改变

<div hidden="hidden" class="test">

至

<div class="test">

并使用display：none;

.test{

    width:350px;
    height:350px;
    background-color:black;
    display:none;


}