Здравствуйте!
Возник вопрос, как задать условие, что бы скрипт стал выполняться, только при прокрутке до необходимого раздела сайта?
Есть счетчик, он запускается сразу при загрузке страницы, а нужно что бы в определенном блоке на странице сайта. Подскажите, как это можно сделать?
<div class="content">
<h1>Всего шагов</h1>
<div class="value" akhi="100">0</div>
</div>
*{
padding:0;
margin:0;
}
h1 {
color: #fff;
}
.content {
display: flex;
justify-content: space-around;
align-items: center;
background: #030303;
height: 100vh;
}
.value {
font-size: 150px;
display: block;
font-weight: bold;
color: #fff;
}
const counters = document.querySelectorAll('.value');
const speed = 200;
counters.forEach( counter => {
const animate = () => {
const value = +counter.getAttribute('akhi');
const data = +counter.innerText;
const time = value / speed;
if(data < value) {
counter.innerText = Math.ceil(data + time);
setTimeout(animate, 1);
}else{
counter.innerText = value;
}
}
animate();
});
или ссылка на
codepen