반응형
jQuery: 클릭 시 설정된 증분(픽셀 단위)을 스크롤 다운 페이지로 이동하시겠습니까?
요소를 클릭하면 페이지가 현재 위치에서 150px 아래로 스크롤되게 하려고 합니다.한 페이지를 대략 반쯤 스크롤했다고 가정해 보겠습니다.이 링크를 클릭하면 150 픽셀이 추가로 이동합니다.
jQuery로 가능한가요?
스크롤 탑과 스크롤 투 플러그인을 보고 있는데 도트가 연결되지 않는 것 같습니다.
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
plugin, 다음을 살펴봅니다.
JQuery $.scrollTo() 함수를 사용하여 창을 스크롤하는 방법
Ariel Flesler의 스크롤 To 플러그인이 정말 잘 하는 무언가를 찾고 있을 수도 있습니다.
http://demos.flesler.com/jquery/scrollTo/
새로운 사람이나 다른 사람들을 위한 순수한 js 솔루션.
var scrollAmount = 150;
var element = document.getElementById("elem");
element.addEventListener("click", scrollPage);
function scrollPage() {
var currentPositionOfPage = window.scrollY;
window.scrollTo(0, currentPositionOfPage + scrollAmount);
}
충돌을 방지하는 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
반응형
'programing' 카테고리의 다른 글
혼합된 컨텐츠가 있는 보안 연결을 통해 지리적 위치에 대한 액세스가 차단되었습니다. (0) | 2023.10.07 |
---|---|
Git 하위 모듈 푸시 (0) | 2023.10.07 |
안드로이드:소프트 키보드 위에 버튼을 누르는 방법 (0) | 2023.10.07 |
xpath를 깨는 xml 네임스페이스! (0) | 2023.10.07 |
기능을 재개하기 전에 자바스크립트 약속이 해결될 때까지 기다리는 방법? (0) | 2023.10.07 |