2013-05-16 48 views
0

我有一個超級菜單和2個子菜單​​。超級魚菜單顯示所有子菜單

ITEM1 
-SUBMENU A -SUBMENU B 
--submenu aa --submenu bb 

我試圖使菜單顯示兩個子菜單列表時,懸停主菜單項(ITEM1) ;這樣的事:http://www.livestrong.org/Shop

這裏是快魚的js代碼:

;(function($){ 
$.fn.superfish = function(op){ 

    var sf = $.fn.superfish, 
     c = sf.c, 
     $arrow = $(['<span class="',c.arrowClass,'"> &#187;</span>'].join('')), 
     over = function(){ 
      var $$ = $(this), menu = getMenu($$); 
      clearTimeout(menu.sfTimer); 
      $$.showSuperfishUl().siblings().hideSuperfishUl(); 
     }, 
     out = function(){ 
      var $$ = $(this), menu = getMenu($$), o = sf.op; 
      clearTimeout(menu.sfTimer); 
      menu.sfTimer=setTimeout(function(){ 
       o.retainPath=($.inArray($$[0],o.$path)>-1); 
       $$.hideSuperfishUl(); 
       if (o.$path.length && $$.parents(['li.',o.hoverClass].join('')).length<1){over.call(o.$path);} 
      },o.delay); 
     }, 
     getMenu = function($menu){ 
      var menu = $menu.parents(['ul.',c.menuClass,':first'].join(''))[0]; 
      sf.op = sf.o[menu.serial]; 
      return menu; 
     }, 
     addArrow = function($a){ $a.addClass(c.anchorClass).append($arrow.clone()); }; 

    return this.each(function() { 
     var s = this.serial = sf.o.length; 
     var o = $.extend({},sf.defaults,op); 
     o.$path = $('li.'+o.pathClass,this).slice(0,o.pathLevels).each(function(){ 
      $(this).addClass([o.hoverClass,c.bcClass].join(' ')) 
       .filter('li:has(ul)').removeClass(o.pathClass); 
     }); 
     sf.o[s] = sf.op = o; 

     $('li:has(ul)',this)[($.fn.hoverIntent && !o.disableHI) ? 'hoverIntent' : 'hover'](over,out).each(function() { 
      if (o.autoArrows) addArrow($('>a:first-child',this)); 
     }) 
     .not('.'+c.bcClass) 
      .hideSuperfishUl(); 

     var $a = $('a',this); 
     $a.each(function(i){ 
      var $li = $a.eq(i).parents('li'); 
      $a.eq(i).focus(function(){over.call($li);}).blur(function(){out.call($li);}); 
     }); 
     o.onInit.call(this); 

    }).each(function() { 
     var menuClasses = [c.menuClass]; 
     if (sf.op.dropShadows && !($.browser.msie && $.browser.version < 7)) menuClasses.push(c.shadowClass); 
     $(this).addClass(menuClasses.join(' ')); 
    }); 
}; 

var sf = $.fn.superfish; 
sf.o = []; 
sf.op = {}; 
sf.IE7fix = function(){ 
    var o = sf.op; 
    if ($.browser.msie && $.browser.version > 6 && o.dropShadows && o.animation.opacity!=undefined) 
     this.toggleClass(sf.c.shadowClass+'-off'); 
    }; 
sf.c = { 
    bcClass  : 'sf-breadcrumb', 
    menuClass : 'sf-js-enabled', 
    anchorClass : 'sf-with-ul', 
    arrowClass : 'sf-sub-indicator', 
    shadowClass : 'sf-shadow' 
}; 
sf.defaults = { 
    hoverClass : 'sfHover', 
    pathClass : 'overideThisToUse', 
    pathLevels : 1, 
    delay  : 800, 
    animation : {opacity:'show'}, 
    speed  : 'normal', 
    autoArrows : true, 
    dropShadows : true, 
    disableHI : false,  // true disables hoverIntent detection 
    onInit  : function(){}, // callback functions 
    onBeforeShow: function(){}, 
    onShow  : function(){}, 
    onHide  : function(){} 
}; 
$.fn.extend({ 
    hideSuperfishUl : function(){ 
     var o = sf.op, 
      not = (o.retainPath===true) ? o.$path : ''; 
     o.retainPath = false; 
     var $ul = $(['li.',o.hoverClass].join(''),this).add(this).not(not).removeClass(o.hoverClass) 
       .find('>ul').hide().css('visibility','hidden'); 
     o.onHide.call($ul); 
     return this; 
    }, 
    showSuperfishUl : function(){ 
     var o = sf.op, 
      sh = sf.c.shadowClass+'-off', 
      $ul = this.addClass(o.hoverClass) 
       .find('>ul:hidden').css('visibility','visible'); 
     sf.IE7fix.call($ul); 
     o.onBeforeShow.call($ul); 
     $ul.animate(o.animation,o.speed,function(){ sf.IE7fix.call($ul); o.onShow.call($ul); }); 
     return this; 
    } 
}); 

})(jQuery); 
+0

你能後你有什麼到目前爲止,我n jsfiddle.net? – Ma9ic

+1

它是一個wordpress主題的菜單,所以它是很多的CSS。 –

回答

0

請試試這個

$("#menu-main li").hover(
    function() { 
    $('.sub-menu').css({"visibility":"visible", "display":"block" }); 

}); 
+0

問題不在腳本中,可見性在改變但菜單不顯示 –

+0

啊好的...對不起..我們需要更多的代碼,然後...你只是給了另一個網站的鏈接... – Baral

+0

我添加了superfish js,我想在這裏我必須進行修改,因爲如果使用jQuery來修改css,我會得到一個雜亂的菜單:) –