스크립트 관련
본문
스크롤시 상단에 고정되는 스크립트를 사용중인데요
$( document ).ready( function() {
var jbOffset = $( '.gnb_area' ).offset();
$( window ).scroll( function() {
if ( $( document ).scrollTop() > jbOffset.top ) {
$( '.gnb_area' ).addClass( 'fixed' );
}
else {
$( '.gnb_area' ).removeClass( 'fixed' );
}
});
});
페이지가 길어서 마우스 휠로 스크롤을 하다보면 스크롤이 잘 되다가 랜덤하게 한번 정도? 멈추는 현상이 있구요.. 그러다가 천천히 다시 마우스 휠을 움직이면 다시 스크롤이 되고 ...
마우스 스크롤 부분에 먼지가 꼈나.. 청소도 해봤는데 스크립트를 해제하면 멀쩡하네요..
저 스크립트는 다른 사이트 몇군데도 사용을 한것인데 다 멀쩡한데 현재 작업중인 사이트만 저러니
참 난감 하네요~
이건 어떤 경우인지요.. 이런 적이 첨이라서 멀 어떻게 해결을 해야 할지 막막하네요..
답변 1
if ( $( document ).scrollTop() > jbOffset.top ) {
이 문장이 가변적일거 같은데요
var jbOffset = $( '.gnb_area' ).offset();
여기서 받아온 gnb_area 의 offset 값보다는
scrollTop() 값이
0보다 작으면
position:fixed 시키고,
top:0px; 로 하는게 혹은원하는 위치
나을것같구요
스크롤시 스크롤로 위아래 옴직여서 현재의 포지션을 체크하는
포인터격인 태그혹은 클래스가 하나 있어야 하지 않을까 생각합니다.
체크점 자체를 고정시키면 스크롤이 원복되었을때 위치점을 찾을수가 없으니까요
개념만 정리하면
로딩(시작)시
고정할 것에 , 스크롤체크할 것 두자리를 두고
스크롤이 발생하는 이벤트에서
스크롤체크하는것이 0보다 작으면
고정할 대상을 0으로 고정
스크롤체크값이 0보다커지면
고정할것의 속성을 고정을 해제하고 기존의 속성으로 원복시켜두면
상단에 고정할 지점이상 스크롤될때만 고정되고
그외에는 내려오지 않을까 합니다.
