CSS : 지연에 하위 메뉴 드롭 다운 추가 (부트 스트랩 3/MegaNavbar 2.2)

Question

이제 공식적으로 절망적입니다. 내 사이트에서 MegaMenu를 사용하기위한 스크립트를 구입했습니다. 스크립트가 호버 I의 하위 메뉴를 열도록 스크립트를 원하므로 데모 페이지에 기술 된 바와 같이 I (위 참조)를 구성 MegaNavBar 2.2 http://preview.codecanyon.net/item/meganavbar-v-220-advanced-mega-menu-for-bootstrap-30/full_screen_preview/8516895?_ga=2.119686542.744579007.1495443523-2131821405.1495443282

이다.

괜찮 았습니다. 그러나 마우스를 위아래로 움직이면 초조해하면서 사용자가 마우스를 움직일 때마다 즉시 메뉴가 열리기 때문에 지연을 추가하려고합니다.

내가 뭘하려 :

• 가 지원 요구 - 대답 원치 않음 애니메이션과 애니메이션 지연 애니메이션이 작동 를 추가하려고
• ,하지만 지연이 작동하지 않습니다, 나는 때문에의 가정 "display : block"
• 전환을 추가하려고 시도합니다. 전환이 "display : block"에서 작동하지 않기 때문에 전환이 작동하지 않습니다.

아무도 저에게이 물건을 도와 줄 수 있습니까? 여기

내 Bootply입니다 : https://www.bootply.com/A50M0Wk9NK

당신은 가시성을 대신 사용하려고 할 수

안부 마이클

Answer 1

(가정 된 CSS 규칙을 붙여 CSS 코드의 29 행에) 따라서 전환을 사용하십시오. 예 :

div > ul { 
    visibility: hidden; 
    opacity: 0; 
    transition: visibility 0s, opacity 0.5s linear; 
} 
div:hover > ul { 
    visibility: visible; 
    opacity: 1; 
    transition-delay:2s; //set delay here 
}