Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 23.05.2017, 21:24
Новичок на форуме
Отправить личное сообщение для Jellyfish Посмотреть профиль Найти все сообщения от Jellyfish
 
Регистрация: 23.05.2017
Сообщений: 1

Не работает анимация.
Есть 2 элемента

<style>
#container { /* описание эемента с id=container*/
width: 200px;
height: 200px;
background: green;
position: relative;
}
#box {
width: 50px;
height: 50px;
background: red;
position: absolute;
}
</style>
<div id="container">
<div id="box"></div>
</div>

и скрипт к ним:

window.onload = function() {
var pos = 0; //старотовая позиция
var box = document.getElementByld('box'); //выбираем объект по ID
var t = setInterval(move, 10);

function move() {
if(pos >= 150){
clearInterval(t);
}
else {
pos += 1;
box.style.left = pos + 'px'; //px = pixels
}
}
};

С телефона тоже самое вбиваю, всё работает. Пишу с брекетсов на компьютере, квадрат просто стоит на месте. В чём проблема?
Ответить с цитированием
  #2 (permalink)  
Старый 23.05.2017, 22:03
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

Сообщение от Jellyfish
В чём проблема?
в невнимательности, откройте консоль, исправьте ошибку.

Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:
[js]
... ваш код...
[/js]


О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.
Ответить с цитированием
  #3 (permalink)  
Старый 06.06.2017, 21:01
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

<head>
<style>
#container { /* описание эемента с id=container*/
width: 200px;
height: 200px;
background: green;
position: relative;
}
#box {
width: 50px;
height: 50px;
background: red;
position: absolute;
}
</style>
</head>
<body>
<div id="container">
<div id="box"></div>
</div>
<script>
window.onload = function() {
var pos = 0; //старотовая позиция
var box = document.getElementById('box'); //выбираем объект по ID
var t = setInterval(move, 10);

function move() {
if(pos >= 150){
clearInterval(t);
}
else {
pos += 1;
box.style.left = pos + 'px'; //px = pixels
}
}
};
</script>
</body>

ошибка в коде
document.getElementById
был неправильно написан!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
AddEventListener не правильно работает с классами Flakky Events/DOM/Window 2 27.05.2016 13:51
Не работает всплывающая форма на второстепенных страницах denjer Javascript под браузер 0 22.04.2016 21:30
jQyery функция странно работает! Midel Общие вопросы Javascript 4 08.04.2012 13:40
Из-за цикла не работает анимация Isaac Общие вопросы Javascript 28 07.08.2011 12:17
помогите найти ошибку (работает в IE но не работает в Firefox) Len4ik Javascript под браузер 2 11.05.2010 15:41