페이지 상단으로 스크롤 하는 버튼을 하단으로 이동하게 바꾸는 방법
현재 스크립트는 아래와 같습니다.
</p>
<p>const goTop = document.querySelectorAll(".at-go .go-top");</p>
<p> </p>
<p> goTop.forEach(function(go) {</p>
<p> go.addEventListener("click", function(e) {</p>
<p> e.preventDefault();</p>
<p> let scrollInterval = setInterval(function() {</p>
<p> let scrollTop = window.scrollY;</p>
<p> </p>
<p> if(scrollTop > 0){</p>
<p> window.scrollBy(0, -55);</p>
<p> } else {</p>
<p> clearInterval(scrollInterval);</p>
<p> }</p>
<p> }, 15);</p>
<p> });</p>
<p> });</p>
<p>
이 스크립트의 어느부분을 바꾸면 페이지 최하단으로 이동하게 만들수 있을까요?
답변 3개
if(scrollTop > 0){ <== 이게 있으니 window.scrollBy과 이별하지 못하고 계속 실행 상태로 있기 때문입니다
(아래로 내리면 언제나 스크롤 값이 0보다 큰 상태이니까요)
if(scrollTop > 0) 을 다음처럼 바꾸세요
if(Math.round(scrollTop) < document.body.scrollHeight - window.innerHeight ){
저런 복잡한 스크립트 없이 간단히 한 줄만 해도 될 것을....
document.body.scrollTop = 10000;
그런데 .go-top <==이 버튼이 여러개 인가요?
한개만 있다면 저렇게 하는 것이 아니라 다음처럼 간단히....
go = document.querySelector(".go-top");
go.addEventListener("click", function(e) {
댓글을 작성하려면 로그인이 필요합니다.
</p>
<p>const goTop = document.querySelectorAll(".at-go .go-top");
goTop.forEach(function(go) {
go.addEventListener("click", function(e) {
e.preventDefault();
let scrollInterval = setInterval(function() {
let scrollTop = window.scrollY;
// if(scrollTop > 0){
// window.scrollBy(0, -55);
if(scrollTop < document.documentElement.scrollHeight - window.innerHeight){
window.scrollBy(0, 55);
} else {
clearInterval(scrollInterval);
}
}, 15);
});
});</p>
<p>댓글을 작성하려면 로그인이 필요합니다.
-55 부분을 양수로 처리하면 아래로 내려갑니다.
https://homzzang.com/b/js-1769 참고해 보세요.
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인