정필성

닫기 버튼 없이도 토글하면 사라지고, 다른영역 클릭시 사라지는 전체보기 메뉴

<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>

|

댓글 5개

이런게 팁게에 올라오니 너무 좋네요..
유용한 정보 감사합니다.
팁 감사합니다., 스크랩해놓고 사용할때 활용해봐야겠네요
훌륭합니다.
댓글을 작성하시려면 로그인이 필요합니다.

그누보드5 팁자료실

+
제목 글쓴이 날짜 조회
5년 전 조회 3,764
5년 전 조회 7,147
5년 전 조회 3,944
5년 전 조회 4,982
5년 전 조회 2.5만
5년 전 조회 3,379
5년 전 조회 3,852
5년 전 조회 3,613
5년 전 조회 4,380
5년 전 조회 3,220
5년 전 조회 4,310
5년 전 조회 4,490
5년 전 조회 3,344
5년 전 조회 4,192
5년 전 조회 6,880
5년 전 조회 5,059
5년 전 조회 3,560
5년 전 조회 6,489
5년 전 조회 3,194
5년 전 조회 4,775
5년 전 조회 5,160
5년 전 조회 5,147
5년 전 조회 4,129
5년 전 조회 3,475
5년 전 조회 4,288
6년 전 조회 1.7만
6년 전 조회 3,833
6년 전 조회 5,211
6년 전 조회 5,205
6년 전 조회 6,267
🐛 버그신고