點擊引導菜單下拉動畫

我有下拉動畫的問題。我發現了一個很好的工作代碼，但它在懸停事件上起作用。現在，我需要一些幫助來調整「點擊」事件中的代碼。這是我的代碼https://jsfiddle.net/pLrLLgoj/206/。點擊引導菜單下拉動畫

代碼：

$(function(){ 
$(".dropdown").hover(   
     function() { 
      $('.dropdown-menu', this).stop(true, true).fadeIn("fast"); 
      $(this).toggleClass('open'); 
      $('b', this).toggleClass("caret caret-up");     
     }, 
     function() { 
      $('.dropdown-menu', this).stop(true, true).fadeOut("fast"); 
      $(this).toggleClass('open'); 
      $('b', this).toggleClass("caret caret-up");     
     }); 
});

來源

2017-04-18 DraganK

下拉你不想上的動畫徘徊？ –

我想要某些屏幕尺寸，但是當我調整它的尺寸時，它不是一個明智的選擇。 – DraganK

只需檢測移動設備並解除懸停並將其與點擊進行綁定即可。 –

檢查I modified your fiddle

我已經刪除JS，改變只CSS動畫上點擊

.dropdown-menu { 
    -webkit-transition: all .5s ease-out; 
    transition: all .5s ease-out; 
    transform: rotateX(90deg); 
    transform-origin: top; 
    opacity: 0; 
    display: block; 
    width: 100%; 
    border: none; 
} 
.open .dropdown-menu { 
    opacity: 1; 
    transform: rotateX(0deg); 
    transform-origin: top; 
    width: 100%; 
    border: none; 
}

來源

2017-04-18 07:14:27

是的，這工作得很好=），謝謝！ – DraganK

點擊引導菜單下拉動畫

回答

相關問題