닫기 버튼 없이도 토글하면 사라지고, 다른영역 클릭시 사라지는 전체보기 메뉴 정보
닫기 버튼 없이도 토글하면 사라지고, 다른영역 클릭시 사라지는 전체보기 메뉴본문
<style>
#gnb_all{width:100%;height:30%; background:red; display:none; position:absolute; color:#fff; z-index:99999; text-align:center; margin:0px auto}
.gnb_menu_btn{width:300px; margin:0 auto; cursor:pointer; text-align:center; padding:10px; border-radius:5px; border:solid 1px #ddd}
</style>
<div class="gnb_menu_btn">버튼을 누르세요</div>
<div id="gnb_all">something I want to show</div>
<script>//닫기 버튼 없이도 토글하면 사라지고, 다른영역 클릭시 사라지는 전체보기 메뉴
$(document).ready(function(){
$('.gnb_menu_btn').click(function(event){
event.stopPropagation();
$("#gnb_all").slideToggle("slow");
});
$("#gnb_all").on("click", function (event) {
event.stopPropagation();
});
});
$(document).on("click", function () {
$("#gnb_all").hide();
});
</script>
6