div로 스크롤 할 때 페이지 상단에 달라 붙지 않는 문제

-1

로 스크롤 할 때 페이지 상단에 div "button_tray"스틱을 만들려고합니다. 전체 페이지 그래서 당신은 내가 할 노력하고있어 더 나은 아이디어를 얻을 수 있습니다 다음과 같습니다 http://tinypic.com/r/n6cnte/8 그것은 내가 jsfiddle로 작업이 필요한 코드의 비트를 붙여 넣을 때 작동하는 것 같군div로 스크롤 할 때 페이지 상단에 달라 붙지 않는 문제

: http://jsfiddle.net/5ADzD/641/

그래서 나는 그것이 실제로 작동하지 않게 만드는 이유가 무엇인지 모릅니다.

감사합니다.

HTML : CSS의

<doctype html> 
    <html> 
     <head> 
      <meta charset="utf-8"> 
      <link rel="stylesheet" href="<?php bloginfo(stylesheet_url)?>"/> 
      <script type="text/javascript" src="sticky.js"></script> 
     </head> 
      <body> 
       <div id="main_img"></div> 

       <div id="button_tray"> 
        Sample 1 
        Sample 2 
        Sample 3 
       </div> 

      <div id="content">

부분 :

#button_tray { 
    width: 100%; 
    height: 100px; 
    background-color: #373737; 
    line-height: 100px; 
    color: orange; 
    font-size: 22px; 
    text-align: center; 
} 

#button_tray.sticky { 
    position: fixed; 
    top: 0px; 
}

JS는 :

var $window = $(window); 
      $stickyEl = $('#button_tray'); 
      var elTop = $stickyEl.offset().top; 
      $window.scroll(function() { 
       var windowTop = $window.scrollTop(); 
       $stickyEl.toggleClass('sticky', windowTop > elTop); 
      });

출처

2014-11-30 Eric

_ 작동하지 않습니다. '# button_tray' 전에 샘플 텍스트를 삽입했는데 문제가 생길 수 없습니다. Div는 완전히 아래로 스크롤 할 때 맨 위에 붙어 있습니다. –

그것은 Wordpress에 대한 사용자 정의 테마를 구축하고 있기 때문에 Wordpress는 그것과 아무 상관이없는 – Eric

을 고집하지 않습니까? – Eric

-3

사업부 태그는 CSS없이 위에서 아래로 서로 적층되어있다.

아마도 구문 오류가 있습니다. #button_tray를 사용하는 대신 .button_tray를 사용해보십시오.

출처

2014-11-30 14:28:09 FirpliusCEO

분명히, 당신은 심지어 id와 class selector의 차이점을 얻지도 못했습니다. –

는 작동하지 않는 것 같습니다 – Eric

jsfiddle에서 작동하기 때문에 이상하게 보입니다 ... – Eric

div로 스크롤 할 때 페이지 상단에 달라 붙지 않는 문제

답변

관련 문제