點擊顯示Superfish下拉菜單

我使用引導程序3，我有菜單。我也使用superfish.js作爲菜單。它的工作原理，但它顯示懸停下拉菜單，但我想點擊下拉菜單。點擊顯示Superfish下拉菜單

我的HTML：

<div id="navbar-collapse-menu" class="collapse navbar-collapse"> 
    <ul id="menu-testing-menu" class="nav navbar-nav sf-js-enabled" style="touch-action: pan-y;"> 
     <li class="menu-item menu-item-has-children dropdown"> 
      <a class="sf-with-ul" data-toggle="dropdown">Home</a> 
      <ul class="dropdown-menu" style="display: none;"> 
       <li class="menu-item"> 
        <a href="#">Lorem Ipdum</a> 
       </li> 
       <li class="menu-item"> 
        <a href="#">Lorem Ipdum</a> 
       </li> 
       <li class="menu-item"> 
        <a href="#">Lorem Ipdum</a> 
       </li> 
      </ul> 
     </li> 
    </ul> 
</div>

我的JS：

$("#menu-testing-menu").superfish({ 
    delay: 100, 
    animation: { 
     opacity: 'show', 
     height: 'show' 
    }, 
    speed: 'normal', 
    cssArrows: false 
});

我的CSS：

li.menu-item.dropdown:hover .dropdown-menu { 
    visibility: visible; 
}

那麼，這可能顯示在點擊下拉菜單？

來源

2017-05-25 name name2

的可能的複製[快魚的jQuery菜單，單擊打開而不是懸停]（https://stackoverflow.com/questions/7312414/superfish-jquery-menu-open-on-click-rather-than-hover） – isherwood

這不是一個引導問題ñ。 Superfish沒有事件選項，所以你不得不破解它。 – isherwood

可能會幫助你：https：//stackoverflow.com/questions/7312414/how-can-i-open-a-superfish-jquery-menu-on-click-rather-than-hover – Bhuwan

Superfish不提供此選項：它是合適的打開/關閉懸停/關閉菜單的權利。爲了打開/顯示下拉一個點擊，您可以：

禁用（stopPropagation）的mouseenter鼠標移開
show/hide上點擊菜單

$("#menu-testing-menu").superfish({ 
    delay: 100, 
    animation: { 
     opacity: 'show', 
     height: 'show' 
    }, 
    speed: 'normal', 
    cssArrows: false 
}); 
$('.sf-with-ul').on('mouseenter mouseout', function(e) { 
    e.stopPropagation(); 
}) 
$('.sf-with-ul').on('click', function (e) { 
    $(".dropdown-menu").toggle(!$(".dropdown-menu").is(':visible')); 
})

來源

2017-05-25 17:09:12 gaetanoM

點擊顯示Superfish下拉菜單

回答

相關問題