컴

브라우저 상단에 고정 시키는 제이쿼리 소스

· 2014-10-17 (금) 03:14:20 · 3594

<script src="http://code.jquery.com/jquery-latest.js"></script>


<script type="text/javascript">
$(function(){
    var menupos = $("#header").offset().top;
    $(window).scroll(function(){
       if($(window).scrollTop() >= menupos) {
          $("#header").css("position","fixed");
          $("#header").css("top","0");
          $('#top_mar').show();
          }
    });
 });
 </script>

 

<header id="#header"> 

<div id="top_mar" style="display:none;">상단에 고정된 영역</div>

</header>

제이쿼리를 이용하여 div 태그를 상단에 고정하는 소스에요.

빨강색 부분에 네비게이션 메뉴 코딩을 넣으면 메뉴를 상단에 고정하는 소스로 활용도 할 수 있어요 

 

 

 

|
댓글을 작성하시려면 로그인이 필요합니다.

팁게시판

6,077건

디자인과 관련된 유용한 정보를 공유하세요. 질문은 상단의 QA에서 해주시기 바랍니다.

+
제목 글쓴이 날짜 조회
15-07-30 조회 1,173
15-06-08 조회 3,096
15-05-27 조회 1,970
15-01-08 조회 4,076
14-12-30 조회 2,727
14-10-10 조회 2,573
14-08-13 조회 3,499
14-08-11 조회 2,205
14-08-06 조회 3,581
14-03-19 조회 4,657
13-04-26 조회 6,692
12-12-15 조회 2,405
12-12-15 조회 4,658
12-12-11 조회 2,611
12-11-21 조회 3,101
12-10-11 조회 2,474
12-10-03 조회 2,221
12-09-20 조회 3,620
12-09-02 조회 1,897
12-08-29 조회 2,400
12-08-29 조회 1,570
12-08-24 조회 1,781
12-08-18 조회 2,014
12-08-17 조회 1,949
12-08-16 조회 1,269