제이쿼리 오류
본문
초보 퍼블리셔입니다ㅠㅠ
창이 모바일 사이즈로 줄어들면 메뉴가 클릭하면 드롭다운되는 형식으로 바뀌는데요,
메인페이지에서만 slideToggle이 제대로 작동이 안되네요..
클릭하면 display:none 해놨던 메뉴가 block상태가 되고, 한번 더 클릭하면 다시 none이 되어야하는데
크롬으로 확인해보니 클릭하니 block이 됐다가 바로 다시 none으로 바뀌더라구요..
그런데 서브페이지는 정상적으로 작동돼요.
어떻게 해야할까요ㅠㅠ도와주세요..
링크는 http://busanmedia.co.kr/futurecampus/html/index.html 입니다.
스크립트는
$('.m_menu_icon').bind('click', function () {
$('.m_slide_menu').slideToggle(500);
});
이렇게 넣었어요ㅠㅠ
반응형이라 720px 이하로 창을 줄여야지 문제의 메뉴가 등장합니당..
답변 1
// Mobile Menu
$('.m_menu_icon').bind('click', function () {
$('.m_slide_menu').slideToggle(500);
});
// mobile_menu
$('.m_menu_icon').bind('click', function () {
$('.m_slide_menu').stop().toggle(500);
});
두개로 bind 하지 마시고 하나에서 $('.m_slide_menu').toggle(500); 해보심이..
그래도 안될경우 급한 땜빵으로 아래처럼 변수 선언해서 상태값 확인 하고 두가지 쓰시는게 좋을것 같네요.
var aaa= 1;
$('.m_menu_icon').bind('click', function () {
if (aaa==1){
$('.m_slide_menu').slideToggle(500);
aaa=2;
}else{
$('.m_slide_menu').stop().toggle(500);
aaa=1;
}
});
말씀해주신대로 수정해봤는데 그래도 그대로네요....왜 메인페이지만 제대로 안나오는지ㅠㅠ어쨌든 감사드립니다! 더 공부를 해야겠어요ㅠㅠ
맙소사..........제가 위에 슬라이드하는 스크립트를 넣어놓고 밑에서 또 똑같은걸 넣어놨네요........두개로 하지말라는 말씀이 그거였구나ㅜㅜ멍청이였어요 감사드립니다ㅠㅠ!!!!!