부트 스트랩 드롭 다운 호버 천이

Question

호버의 내 부트 스트랩 드롭 다운 메뉴에서 페이드 인 변환을 시도하고 있습니다. 지금까지 나는 행운이없이 다음을 시도했다.

내 시도

.dropdown-menu { 
    display: block; 
    opacity: 0; 
    -moz-transition: all 1000ms ease; 
    -webkit-transition: all 1000ms ease; 
    -o-transition:  all 1000ms ease; 
    -ms-transition:  all 1000ms ease; 
    transition:   all 1000ms ease; 
} 

.sidebar-nav li:hover .dropdown-menu { 
    display: block; 
    opacity: 1; 
} 

이 작동하지 않았다. 그것은 1000ms 지연 시켰지만 어떤 변화도 추가하지 않았습니다. 또한 jQuery로 시도했지만 행운도 없었다.

Here's a fiddle with the code - 드롭 다운 메뉴는 메뉴의 첫 번째 링크 인 "Arla nu"에 있습니다.

Answer 1

전환 할 내용을 중단 한 것 같습니다.

.dropdown-menu { 
    -webkit-transition: opacity 1000ms ease; 
    -moz-transition: opacity 1000ms ease; 
    -o-transition: opacity 1000ms ease; 
    transition: opacity 1000ms ease; 
    opacity: 0; 
} 
.sidebar-nav li:hover .dropdown-menu { 
    opacity: 1; 
} 

Answer 2

.dropdown .dropdown-menu{ 
    display: block; 
    opacity: 0; 

    -moz-transition: all 1000ms ease; 
    -webkit-transition: all 1000ms ease; 
    -o-transition:  all 1000ms ease; 
    -ms-transition:  all 1000ms ease; 
    transition:   all 1000ms ease; 
} 
.dropdown:hover .dropdown-menu { 
    display: block; 
    opacity: 1; 
} 

너무

$(function(){ 
    var $menu = $('.dropdown-menu'); 

    $('.dropdown-toggle').hover(
    function() { 
     $menu.css('opacity',1); 
    }, 
    function() { 
     $menu.css('opacity',0); 
    }); 
})(); 

이 JSfiddle

업데이트

확인 바이올린 http://jsfiddle.net/pjej7o2m/296/

와 답을 갱신 윌 JS 기능 추가