묻고답하기
모바일 gnb관련 layout.js파일 수정 문의드립니다.
2017.10.11 15:12
Xedition 사용하고 있구요.
반응형이라 모바일용으로는 따로 스킨을 쓰고있지는 않습니다.
모바일에서 접속을 하면 1차메뉴와 2차 메뉴가 모두 보여지고 있는데 1차메뉴만 보이고 2차 메뉴는 1차메뉴 클릭했을때 드롭다운으로 보여지도록 하고 싶은데 도와주세요.ㅠㅠ
아래는 layout.js 파일에서 gnb부분만 적어놓았습니다. 고수님들 부탁드립니다.
// Gnb
if($(document).width() > 480){
$gnb.addClass('pc-gnb');
}
var $pc_gnb = $('.pc-gnb');
$pc_gnb.find('>ul>li>a')
.mouseover(function(){
$gnb.find('>ul>li>ul:visible').hide().parent('li').removeClass('on');
$(this).next('ul:hidden').stop().fadeIn(200).parent('li').addClass('on')
})
.focus(function(){
$(this).mouseover();
})
.end()
.mouseleave(function(){
$gnb.find('>ul>li>ul').hide().parent().removeClass('on')
});
$pc_gnb.find('>ul>li>ul>li>a')
.mouseover(function(){
$gnb.find('>ul>li>ul>li>ul:visible').hide().parent('li').removeClass('on');
$(this).next('ul:hidden').stop().fadeIn(200).parent('li').addClass('on')
})
.focus(function(){
$(this).mouseover();
})
.end()
.mouseleave(function(){
$gnb.find('>ul>li>ul>li>ul').hide().parent().removeClass('on')
});
$("#mobile_menu_btn").on('click', function(){
var isOpened = $(this);
if(isOpened.hasClass('opened')){
$("#gnb").find(">ul").slideUp(200);
}else{
$("#gnb").find(">ul:not(:animated)").slideDown(200);
}
isOpened.toggleClass('opened');
});