缩短JavaScript

Question

I got some help a few weeks ago on some code for a drop down menu but I am wondering if it is possible to make the code shorter because the current code shown below is quite big, any help would be great.

    $(document).ready(function(){
$("#zone-bar li em").mouseenter(function() {
   var hidden = $(this).parents("li").children("ul").is(":hidden");

   $("#zone-bar>ul>li>ul").hide()        
   $("#zone-bar>ul>li>a").removeClass();

   if (hidden) {
       $(this).parents("li").children("ul").toggle()
              .parents("li").children("a").addClass("zoneCur");
   } 
});

$("#zone-bar>ul>li>ul").mouseleave(function() {
   var hidden = $(this).parents("li").children("ul").is(":hidden");

   $("#zone-bar>ul>li>ul").hide()        
   $("#zone-bar>ul>li>a").removeClass();

   if (visable) {
       $(this).parents("li").children("ul").toggle()
              .parents("li").children("a").addClass("zoneCur");
   } 
});
        });

Answer 1

这是使用jQuery创建下拉菜单的38种方法 。

Answer 2

From the looks of it, this can be done using only CSS. Check out github The menus "switch branch" and "switch tags" are done using CSS only. Another option would be using a JS minifier