development

jQuery : 클릭시 설정된 증분 (픽셀)만큼 페이지를 아래로 스크롤 하시겠습니까?

big-blog 2021. 1. 5. 21:03
반응형

jQuery : 클릭시 설정된 증분 (픽셀)만큼 페이지를 아래로 스크롤 하시겠습니까?


요소를 클릭 할 때 페이지가 현재 위치에서 150px 아래로 스크롤되도록 만들려고합니다. 따라서 대략 페이지의 절반 정도 아래로 스크롤되었다고 가정 해 보겠습니다. 이 링크를 클릭하면 추가로 150 픽셀 아래로 이동합니다.

jQuery로 가능합니까?

scrollTop과 scrollTo 플러그인을 살펴 보았지만 점을 연결할 수없는 것 같습니다.


var y = $(window).scrollTop();  //your current y position on the page
$(window).scrollTop(y+150);

다음을 확인하십시오.

$(document).ready(function() {
    $(".scroll").click(function(event){
        $('html, body').animate({scrollTop: '+=150px'}, 800);
    });
});

요소를 클릭하면 현재 위치에서 스크롤러가 스크롤됩니다.

150px는 아래로 150px 스크롤하는 데 사용됩니다.


animate다음 링크에서와 같이 사용할 수 있습니다 .

http://blog.freelancer-id.com/index.php/2009/03/26/scroll-window-smoothly-in-jquery

scrollTo플러그인 을 사용하여 수행 하려면 다음을 살펴보십시오.

JQuery $ .scrollTo () 함수를 사용하여 창을 스크롤하는 방법


Ariel Flesler의 scrollTo 플러그인이 정말 잘하는 무언가를 추구 할 수 있습니다.

http://demos.flesler.com/jquery/scrollTo/


충돌을 방지하는 HCD 솔루션의 업데이트 된 버전 :

var y = $j(window).scrollTop(); 
$j("html, body").animate({ scrollTop: y + $j(window).height() }, 600);

참조 URL : https://stackoverflow.com/questions/2659354/jquery-scroll-down-page-a-set-increment-in-pixels-on-click

반응형