Изменение свойства CSS
Есть вот это - <div id="case" style="background-position: -975px 0px;"></div>
Надо свойство background-position плавно менять на 0px. Т.е. чтобы получилось так - <div id="case" style="background-position: 0px 0px;"></div> Но не рывком, а плавно (-975, -974, -973 ... -2, -1, 0). Я с JS совсем не дружу. Прошу помощи профессионалов) |
тип так
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="case"></div>
<script>
var idCase = document.getElementById('case');
var i = -975;
function smoothCh() {
if (i == 0) clearTimeout(timer);
else {
idCase.style.backgroundPosition = i++ + 'px 0px';
var timer = setTimeout(smoothCh, 20);
}
}
smoothCh();
</script>
</body>
</html>
|
Супер. То что нужно. Спасибо!
Но почему скрипт не работает с шапки? |
так пробуй
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
var i = -975;
function smoothCh() {
var idCase = document.getElementById('case');
if (i == 0) clearTimeout(timer);
else {
idCase.style.backgroundPosition = ++i + 'px 0px';
var timer = setTimeout(smoothCh, 20);
}
}
document.addEventListener('DOMContentLoaded', smoothCh)
</script>
</head>
<body>
<div id="case"></div>
</body>
</html>
|
| Часовой пояс GMT +3, время: 16:23. |