정필성

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

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

이런게 팁게에 올라오니 너무 좋네요..
유용한 정보 감사합니다.
팁 감사합니다., 스크랩해놓고 사용할때 활용해봐야겠네요
훌륭합니다.
댓글을 작성하시려면 로그인이 필요합니다.
+
제목 글쓴이 날짜 조회
20-03-12 조회 7,590
20-03-12 조회 7,755
20-03-12 조회 8,330
20-03-12 조회 7,728
20-03-11 조회 9,016
20-03-09 조회 9,337
20-03-09 조회 7,366
20-03-05 조회 6,906
20-03-05 조회 7,629
20-03-03 조회 1.1만
20-03-02 조회 7,905
20-03-02 조회 8,842
20-03-01 조회 3만
20-02-28 조회 7,408
20-02-26 조회 7,733
20-02-26 조회 7,478
20-02-24 조회 8,216
20-02-23 조회 7,010
20-02-20 조회 8,144
20-02-18 조회 8,352
20-02-18 조회 7,157
20-02-12 조회 7,960
20-02-11 조회 1.1만
20-02-10 조회 8,942
20-02-09 조회 7,456
20-02-09 조회 1만
20-02-08 조회 6,938
20-02-08 조회 8,743
20-02-08 조회 9,121
20-02-07 조회 9,036