將鼠標懸停在Twitter引導程序按鈕上無法正常工作

我試圖在下面的代碼片段中使用jQuery獲取彈出式下拉菜單，但沒有運氣。將鼠標懸停在Twitter引導程序按鈕上無法正常工作

我遵循類似的邏輯，我在我的引導程序導航欄（工作正常），但在下面的示例中，當我將鼠標懸停在按鈕上，我可以看到菜單項，但只要我移動鼠標關閉菜單消失的按鈕 - 我做錯了什麼？

PS如果我快速移動光標，我只需要'捕捉'彈出式菜單。

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="//code.jquery.com/jquery-1.10.2.js"></script> 
 
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
 
     
 
       
 
<!-- Latest compiled and minified JavaScript --> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 
 

 
<script> 
 
    $(function(){ 
 
     $('.dropdown').hover(function() { 
 
        $(this).addClass('open'); 
 
       }, 
 
       function() { 
 
        $(this).removeClass('open'); 
 
       }); 
 
    }); 
 
</script>

<!-- Latest compiled and minified CSS --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 
 

 

 
<div class="container"> 
 
    <div class="dropdown"> 
 
     <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> 
 
      Select event: 
 
      <span class="caret"></span> 
 
     </button> 
 
     <ul class="dropdown-menu" aria-labelledby="dropdownMenu1"> 
 
      <li><a href="event/1">Event #1</a></li> 
 
      <li><a href="event/2">Event #2</a></li> 
 
     </ul> 
 
    </div> 
 
</div>

來源

2016-05-17 Bendy

爲了您的下拉菜單中應用最高位置98％而不是100％。所以它不會離開下拉div的焦點。

.dropdown-menu { top: 98% }

來源

2016-05-17 06:59:03

只需添加了CSS的

.dropdown-menu { margin:0; }

的利潤率空間，使得它很難跨越跳轉到項目

來源

2016-05-17 06:54:58 brianlmerritt

非常感謝你:)我不確定這是什麼和@Suresh Ponnukalai的答案之間的「最佳做法」，所以我只能讓手的表演恐怕......！感謝您的快速響應！ – Bendy

隨意使用。我傾向於刪除保證金，因爲這會使變更更加透明。但我碰到@Suresh，因爲他的答案是我通常不會使用的，我需要分支:) – brianlmerritt

將鼠標懸停在Twitter引導程序按鈕上無法正常工作

回答

相關問題