자동스크롤 코드 버그
본문
$(window).on( 'DOMMouseScroll mousewheel', function ( event ) {
var win_top = $(window).scrollTop();
var row1_top = $('#row1').offset().top;
var row2_top = $('#row2').offset().top;
if( event.originalEvent.detail > 0 || event.originalEvent.wheelDelta < 0 ) {
if(win_top == row1_top ){
$('html,body').animate({scrollTop:row2_top},300);
}
} else {
if(win_top < row2_top ){
$('html,body').animate({scrollTop:row1_top},300);
}
}
});
↑첫번째 #row1에서 #row2로 넘어갈때 자동으로 스크롤 되고,
#row2에서 #row1에서 넘어갈때도 자동으로 스크롤되게 사용한 제이쿼리 소스는 이겁니다.
$(".scroll_icon").on("click", function(){
var scmove = $('#row2').offset().top;
$('html, body').animate( { scrollTop : scmove }, 500 );
});
↑이것은 메인비쥬얼에있는 마우스모양 아이콘을 클릭하면 자동으로 #row2로 넘어갈때 사용한 제이쿼리 소스입니다.
$(window).scroll( function(){
$('#row2 #wrap .content .cts1 .circle,#row2 #wrap .content .cts2,#row2 #wrap .content .cts3,#row2 #wrap .content .cts4').each( function(i){
var bottom_of_element = $(this).offset().top + $(this).outerHeight();
var bottom_of_window = $(window).scrollTop() + $(window).height();
if( bottom_of_window > bottom_of_element ){
$(this).addClass('on');
}
});
});
↑이것은 #row2에 있는 콘텐츠가 반쯤 보이면 on이라는 클래스를 붙히라는 제이쿼리 소스입니다.
------------------
이 모든 소스가 같은 js파일에있구요.
이 코드를 보여드린 이유는
#row1에서 #row2로 넘어갈때 버벅거리는 현상이 발생해서 왜 그러는것인지 여쭤보려고합니다.
스크롤 관련된 제이쿼리는 이것들이 다입니다.
혹시라도 겹치는게 있어서 그런건지 여쭤봅니다.
답변을 작성하시기 전에 로그인 해주세요.
