아미(아름다운미소)

[jQuery] 펼침메뉴 본문

랭귀지/JQUERY

[jQuery] 펼침메뉴

유키공 2017. 12. 20. 17:00
jQuery 펼침메뉴 제이쿼리 인클루드

스타일
    .menu a{cursor:pointer;}
    .menu .hide{display:none;}
스크립트
    $(document).ready(function(){
        $(".menu>a").click(function(){
            var submenu = $(this).next("ul");
 
            // submenu 가 화면상에 보일때는 위로 보드랍게 접고 아니면 아래로 보드랍게 펼치기
            if( submenu.is(":visible") ){
                submenu.slideUp();
            }else{
                submenu.slideDown();
            }
        }).mouseover(function(){
            $(this).next("ul").slideDown();
        });
 
		//$(".menu:eq(0)>a").click();
        // menu class 중에 두번째 있는 menu 의 하위에 있는 a태그에 클릭 이벤트를 발생시킨다.
        $(".menu:eq(1)>a").click();
    });

html 마크업

'랭귀지 > JQUERY' 카테고리의 다른 글

trigger prop 차이  (0) 2021.08.17
[jQuery] 날짜선택 위젯- datepicker  (0) 2017.12.21
[Jquery]퀵메뉴  (0) 2017.12.20
[jQuery] 레이어 팝업  (0) 2017.12.18
Comments