Добрый день.
Хочу сделать такой эффект при скролле, как на этом сайте
https://www.tesla.com/
Чтобы скролл на сайте тесла работал, если у вас в браузере есть расширения для плавного скролла, то их следует отключить или открыть сайт в инкогнито.
Ты начинаешь сколить блок, и браузер дальше сам доскроливает до следующего блока.
И нужно, чтобы этот эффект работал и на мобильных устройствах.
Я попытался написать скрипт, но он пока работает только на прокрутку вниз и с рывками, а на мобильных вообще не работает.
function smoothScroll() {
const elems = $(".block-scroll");
let lastScrollTop = 0;
let scroll = true;
$(window).on("scroll", function () {
let st = $(this).scrollTop();
if (st > lastScrollTop) {
elems.each(function (index) {
const currentElem = $(elems[index]);
const currentElemOffsetTop = currentElem.offset().top;
if (
currentElem.hasClass("active") &&
$(window).scrollTop() > currentElemOffsetTop + 200 &&
scroll
) {
scroll = false;
const nextElem = $(elems[index + 1]);
if (nextElem.length > 0) {
const nextElemOffsetTop = nextElem.offset().top;
const htmlBody = $("html, body");
if (!htmlBody.is(":animated")) {
htmlBody.stop(true, true).animate(
{
scrollTop: nextElemOffsetTop,
},
1600
);
setTimeout(function () {
scroll = true;
}, 1200);
}
}
}
});
} else {
}
lastScrollTop = st;
});
}
smoothScroll();
Заранее благодарен.
