jQuery CSS_jquery로 구현된 슈퍼 섹시 드롭다운 메뉴-JS 튜토리얼-php.cn

 
 <스크립트 유형="텍스트/자바스크립트"> 
$(document).ready(function() { 
// 상단 메뉴 
$("ul.submenu1").parent().append("" ); //js가 활성화된 경우에만 드롭다운 트리거를 표시합니다. (ul.submenu1* 뒤에 빈 범위 태그를 추가합니다.) 
$("ul.topmenu lispan").click(function() { //트리거를 클릭할 때 ... 
//다음 이벤트는 하위 메뉴1 자체에 적용됩니다(하위 메뉴1 위아래로 이동) 
$(this).parent().find("ul.submenu1").slideDown('fast') .show(); //클릭 시 하위 메뉴1 드롭다운 
$(this).parent().hover(function() { 
}, function() { 
$(this).parent( ).find("ul.submenu1").slideUp('slow'); //하위 메뉴1 밖으로 마우스를 가져가면 다시 위로 이동합니다. 
})//다음 이벤트가 하위 메뉴에 적용됩니다. Trigger (트리거에 대한 호버 이벤트) 
}).hover(function() { 
$(this).addClass("hover"); //호버 위에 마우스를 올리면 "hover" 클래스 추가 
} , function() { //호버 아웃 시 
$(this).removeClass("hover"); //호버 아웃 시 "hover" 클래스 제거 

$( "ul.topmenu li ul.submenu1 li").hover(function() { 
$(this).find("ul.submenu11:first").show("slow"); 
}, function() { 
$(this).find("ul.submenu11:first").hide("fast"); 
}); 
}); 
 


演示代码