Простой счетчик
Привет уважаемые гуру JS. Я новичек в JS и хочу попросить немного помощи от Вас!
Есть такой HTML код <p class="item2">Вы находитесь на сайте уже <span id="timer_1">0</span> секунд. </p> <p class="item3">За это время <span>Ваш доход </span> с аренды недвижимости мог составить: </p> <p class="item4 amount" id="timer_2">0</p> Данный код лежит на 4-м экране лендинга! Как сделать так чтобы в елементе <span id="timer_1">0</span> при начали бежать секунды от 0 до 1000 (увеличивались на 1) в момент когда пользователь доскролил сайт до 4 екрана! А в елементе <p class="item4 amount" id="timer_2">0</p> цифры бежали (увеличивались на 1) от 0 до 5000, но каждые 0.2 секунды? Помогите маленьким!!!!!!Буду очень благодарен! |
Foknik,
Пожалуйста, отформатируйте свой код! Для этого его можно заключить в специальные теги: js/css/html и т.п., например: [js] ... ваш код... [/js] О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting. |
|
Рони, мне кажется не справится с переделкой
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div style="height:500px;">----------------------</div>
<div style="height:500px;">----------------------</div>
<div style="height:500px;">----------------------</div>
<div style="height:500px;">----------------------</div>
<div style="height:500px;">----------------------</div>
<div style="height:500px;">----------------------</div>
<p class="item2">Вы находитесь на сайте уже
<span id="timer_1">0</span> секунд.
</p>
<p class="item3">За это время <span>Ваш доход </span> с аренды
недвижимости мог составить:
</p>
<p class="item4 amount" id="timer_2">0</p>
<script>
document.addEventListener("scroll", count, false);
function count(){
var t = document.querySelector('#timer_1');
if(t.getBoundingClientRect().top-window.innerHeight<0){
setInterval(function(){
t.textContent++;
},1000);
setInterval(function(){
document.querySelector('#timer_2').textContent++;
},200);
document.removeEventListener("scroll", count, false);
}
}
</script>
</body>
</html>
|
Но вот только человек на сайте может может больше находится, просто не скролил, зачем обманывать.
|
Спасибо тебе огромнейшее j0hnik!!! А еще можеш напиши как сделать так чтобы таймер сразу сработал при загрузке а не при скроле до блока!!!!
|
| Часовой пояс GMT +3, время: 09:00. |