看JQ，解代码。

Question

$(document).ready(function(){
  
  $('li.mainlevel').mouseenter(function(){
   $(this).find('ul').slideDown("fast");
  }).mouseleave(function(){
   $(this).find('ul').slideUp("fast");
  });
  
});
以上这段JQ代码具体是怎么个调用法？ 求一个详细的解释，谢谢。

Answer 1

大概94酱紫。<ul>
<li class="mainlevel">menu1
  <ul style="display:none;">
     something here
  </ul>
</li>
<li class="mainlevel">menu2
  <ul style="display:none;">
     another thing here
  </ul>
</li>
</ul>

Answer 2

$(document).ready(function(){//网页加载完毕后，执行
  
  $('li.mainlevel').mouseenter(function(){//鼠标进入$('li.mainlevel')时执行
      $(this).find('ul').slideDown("fast");//$('li.mainlevel')的ul子节点快速收起 
 }).mouseleave(function(){
      $(this).find('ul').slideUp("fast");//$('li.mainlevel')的ul子节点快速展开
  });
  
});