푸시 메뉴가 상단에 고정

이 page에 Pushy Menu이 사용되고 있습니다. 나는 그것을 정상에 고정시키고 싶다. Pushy의 CSS에는 CSS가 있습니다 `position : fixed; 및 상단 : 0; 기본적으로 아래로 스크롤 할 때 메뉴를 맨 위로 유지하지 않으며 아래로 스크롤하면 메뉴가 사라집니다. 이 문제를 어떻게 해결할 수 있습니까?푸시 메뉴가 상단에 고정

/* Menu Appearance */ 
.pushy { 
position: fixed; 
width: 250px; 
height: 100%; 
top: 0; 
z-index: 9999; 
background: rgb(4, 147, 189); /* wasVery dark grey #191918 */ 
overflow: auto; 
visibility: hidden; 
-webkit-overflow-scrolling: touch; 
/* enables momentum scrolling in iOS overflow elements */ 
}

출처

2017-01-18 mlegg

을 확인 ...이 시도. 'body {padding-top : 44px; }' '.menu-btn {위치 : 고정; 상단 : 0; 왼쪽 : 0; z- 색인 : 9999; transition : 0.2s cubic-bezier (0.16, 0.68, 0.43, 0.99) 변환; }' '.pushy-open-left .menu-btn {transform : translate (250px, 0); }'. http://www.stgertrudelutheran.org/pushy-menu/scss/pushy.scss에서 54-61 행을 삭제하십시오 (선택기'.pushy-open-left { #container, .push {') –

부터 시작해야합니다. 나는 그것을 시험해보고 그것이 어떻게 작용했는지 알려 줄 것입니다. – mlegg

 <style> 
     /* Menu Appearance */ 
     .pushy { 
     /* position: fixed;*/ 
     width: 250px; 
     height: 100%; 
     top: 0; 
     z-index: 9999; 
     background: rgb(4, 147, 189); /* wasVery dark grey #191918 */ 
     overflow: auto; 
     visibility: hidden; 
     -webkit-overflow-scrolling: touch; 
     /* enables momentum scrolling in iOS overflow elements */ 
     } 
     .fix{ 
     position: fixed; 
     } 
     </style> 
    <script> 
     $(window).scroll(function(){ 

      var scroll = $(window).scrollTop(); 
      if (scroll >= 50) 
      { 
       $('.pushy').addClass('fix'); 
      } 
      else { 
       $('.pushy').removeClass('fix'); 
      } 
     }); 
</script>

출처

2017-01-18 06:02:47

감사합니다. – mlegg

사용이 먼저 파일을 백업

.menu-btn { 
     width: 100px; 
     padding: 10px; 
     margin-bottom: 30px; 
     background: #000; 
     color: #FFF; 
     text-align: center; 
     cursor: pointer; 
     position: fixed; 
    } 
    h1 { 
     margin-top: 90px; 
    }

출처

2017-01-18 06:29:10 Uiupdates

푸시 메뉴가 상단에 고정

답변

관련 문제