Shorten JavaScript

Question

Hello, 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

Here are 38 ways to create a drop-down menu with jQuery.

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