Подскажите пожалуйста, как реализовать "чувствительный" эффект анимации, чтобы горизонтальная анимация была привязана к скролу
Пример:
https://drive.google.com/file/d/1W5P6hz-ssfRmjlgsC...
Слово "combo".
Заранее благодарю!
На данный момент я смог сделать анимацию только без "чувствительной" привязки к скролу.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<section class="step1"><h2 class="move">MOVE IT</h2></section>
<section class="step2"><h2>STEP 2</h2></section>
</body>
</html>
.step1 {
height: 100vh;
background: #ccc;
padding: 5rem;
}
.step2 {
height: 500px;
background: yellow;
padding: 5rem;
}
.move {
display: block;
border: solid;
padding: 2rem;
object-fit: contain;
width: 150px;
}
const moveBtn = document.querySelector('.move');
document.addEventListener("scroll", moveRight);
function moveRight() {
moveBtn.style.marginLeft = "200px";
moveBtn.style.transition = "all 1s";
}
