마우스 클릭 시 레이어 팝업 닫기 스크립트요
본문
지금 닫기버튼을 클릭해야 닫게 되어있는데
닫기버튼을 없애고 그냥 마우스로 아무데나 클릭하면 닫히게 하고싶은데요
어떻게 수정하면될까요?
<div class="lnb-box">
<button type="button" class="btn-lnb-close">닫기</button>
<ul>
<li><a href="#"><span class="int">INTRO</span></a></li>
<li><a href="#">SUITE</a></li>
<li><a href="#</a></li>
</ul>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('#header .btn-menu').click(function(){
$(this).toggleClass('open-lnb');
$('.lnb-box').toggleClass('open-lnb');
});
$('.lnb-box .btn-lnb-close').click(function(){
$('#header .btn-menu').removeClass('open-lnb');
$('.lnb-box').removeClass('open-lnb');
});
$('.lang-area .btn-lang').click(function(){
$(this).toggleClass('open-lang');
$('.lang-area ul').toggleClass('open-lang');
});
});
</script>
답변 2
$('.lnb-box .btn-lnb-close')
=>
$('.lnb-box')
레이어 바디 눌러서 닫히는거 말고 그냥 바디 아무데나 눌러서 닫히게 할수는없나요 ?
var flag = true;
$(document).ready(function(){
$('#header .btn-menu').click(function() {
$(this).toggleClass('open-lnb');
$('.lnb-box').toggleClass('open-lnb');
flag = false;
});
$('body').click(function() {
if (!flag) {
flag = true;
return;
}
$('#header .btn-menu').removeClass('open-lnb');
$('.lnb-box').removeClass('open-lnb');
});
$('.lang-area .btn-lang').click(function(){
$(this).toggleClass('open-lang');
$('.lang-area ul').toggleClass('open-lang');
});
});
답변감사합니다~!
해당 소스만 봐서는 레이어 팝업이 어떤 식으로 구성 되어 있는지 알 수는 없지만 일반적으로 처리 하는 방법은
<바디>
<레이어 바디>
<팝업 레이어 />
</레이어 바디>
</바디>
이런식으로 구성 되어 있다는 가정 하에 레이어 바디를 클릭 했을 때 팝업이 닫히도록 처리 합니다.
답변감사합니다~!
