Scroll시 상단고정되는 Sticky Navigation

본문 바로가기

사이트 내 전체검색


Scroll시 상단고정되는 Sticky Navigation

Scroll시 상단고정되는 Sticky Navigation

그누보드5를 위한 스크롤시 상단고정되는 메뉴 스킨입니다.

  

그누보드에 적용방법:

배포판 기본 설치를 기준으로,

1. head.php에 다음을 추가합니다.

<!-- { Sticky Navi 관련 끝 --> 

<script> 

$(document).ready(function () { 

  var $nav = $('#gnb'), 

      posTop = $nav.position().top; 

  $(window).scroll(function () { 

    var y = $(this).scrollTop(); 

    if (y > posTop) { $nav.addClass('fixed'); } 

    else { $nav.removeClass('fixed'); } 

  }); 

}); 

</script> 

<!-- } Sticky Navi 관련 끝 --> 

 

2. css/default.css 에 다음을 추가합니다. 

 

  /* { Sticky관련 */ 

#gnb.fixed { 

  position: fixed; 

  top: 0; 

  left: 0; 

  right: 0; 

/* } Sticky관련 */

 

미리보기 : http://www.live24.co.kr/




그누보드5, 영카트5 기반 프로그램 개발을 위한 사이트입니다.
궁금한 사항은 http://www.365ok.co.kr을 이용하기 바랍니다.
Copyright © 코리아뉴스. All rights reserved. 상단으로
PC 버전으로 보기