Не работает кнопка прокрутки вверх
Кто может подсказать, в чем проблема. Не работает скрипт плавной прокрутки вверх сайта при клике на кнопку.
export default function scrollToTop() {
const body = document.getElementsByTagName('body')[0];
const topArrow = document.querySelector('.top-arrow');
let scrolled;
let timer;
body.addEventListener('scroll', function() {
getWindowScrollTop(this);
});
function scrollToTop(){
if (scrolled > 0) {
window.scrollTo(0, scrolled);
scrolled = scrolled - 50;
timer = setTimeout(scrollToTop, 200);
}
else {
clearTimeout(timer);
window.scrollTo(0, 0);
}
}
function getWindowScrollTop(el) {
let cont_top = el.scrollTop ? el.scrollTop : document.body.scrollTop;
if(cont_top >= 300) {
topArrow.classList.add('top-arrow--show');
topArrow.onclick = () => {
scrolled = window.pageYOffset;
scrollToTop();
}
} else {
topArrow.classList.remove('top-arrow--show');
}
}
}
|
DVV,
[html run] ... минимальный код страницы с вашей проблемой [/html] О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting. |
|
DVV,
строка 29 должна быть в строке 6. почему на вашей странице не работает window.scrollTo может кто-то ещё подскажет. |
DVV,
<!DOCTYPE html>
<html lang="ru">
<head>
<title>T-Task</title>
<style type="text/css">
p {
height: 2000px;
}
.top-arrow {
position: fixed;
display: none;
top: 10px;
right: 10px;
}
.top-arrow.top-arrow--show {
display: block;
}
</style>
</head>
<body>
<p></p>
<button class="btn top-arrow">вверх</button>
<script>
function scrollToTop() {
const body = document.getElementsByTagName('body')[0];
const topArrow = document.querySelector('.top-arrow');
let scrolled;
let timer;
topArrow.onclick = () => {
scrolled = window.pageYOffset;
scrollToTop();
}
window.addEventListener('scroll', function() {
getWindowScrollTop(this);
});
function scrollToTop() {
clearTimeout(timer);
if (scrolled > 0) {
scrolled = scrolled - 15;
timer = setTimeout(scrollToTop, 10);
}
window.scrollTo(0, scrolled);
}
function getWindowScrollTop(el) {
topArrow.classList.toggle('top-arrow--show', el.pageYOffset >= 300)
}
};
scrollToTop()
</script>
</body>
</html>
|
| Часовой пояс GMT +3, время: 02:10. |