Есть вот такой код
let currentScreen = 0
addEventListener('wheel', function(e) {
if (e.deltaY < 0) currentScreen--
else currentScreen++
if (currentScreen < 0) currentScreen = 4
if (currentScreen > 4) currentScreen = 0
})
function ease(t) {
return t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1
}
function ПлавныйСкролл() {
window.scroll(0, currentScreen * innerHeight)
requestAnimationFrame(ПлавныйСкролл)
}
requestAnimationFrame(ПлавныйСкролл)
body {
margin: 0;
overflow: hidden;
}
.screen {
height: 100vh;
}
.screen_1 {
background-color: lightblue;
}
.screen_2 {
background-color: lightgreen;
}
.screen_3 {
background-color: tomato;
}
.screen_4 {
background-color: moccasin;
}
.screen_5 {
background-color: chocolate;
}
<div class="screen screen_1">1</div>
<div class="screen screen_2">2</div>
<div class="screen screen_3">3</div>
<div class="screen screen_4">4</div>
<div class="screen screen_5">5</div>
и вот такая функция, которую нашел на просторах интернета
easeInOutCubic: t => t<.5 ? 4*t*t*t : (t-1)*(2*t-2)*(2*t-2)+1
.
Не могу понять, что такое t
и как это всё соединить вместе.