Установить вертикальное положение элемента HTML

Если я вынул счетчик переменных и просто установил document.getElementById("movee").style.top, равный числу, он отлично работает. Объединение счетчика переменных и этого бита кода теоретически обеспечило бы перемещение изображения. По какой-то причине это не работает!Установить вертикальное положение элемента HTML

<html> 
<style type="text/css"> 
    #movee 
    { 
     position:absolute; 
    } 
</style> 

<script type="text/javascript"> 
    function goDown() 
    { 
     var counter=1; 
     while (counter<300) 
     { 
      document.getElementById("movee").style.top="counter"; 
      var counter=counter+1; 
     } 
    } 
</script> 

<input type="button" onclick="goDown()" value="Move!"> 
<img src="test.png" id="movee"></img> 
</html>

источник

2013-02-23 user1743825

Вы установка верхнего свойство стиля #movee в строку " счетчик»не значение переменного счетчика

document.getElementById("movee").style.top=counter+"px";

Кроме того, кажется, вы пытаетесь оживить элемент, ваша техника не будет работать, так как обновление будет происходить только после финишной скрипт работает. Я предлагаю посмотреть на css-переходы или библиотеку, которая выполняет анимацию, например jQuery (jQuery.animate).

источник

2013-02-23 19:27:47 Musa

Не уверен в этом на 100%, но с использованием функции setTimeout и curried (для изменения переменных) разрешите движение во время выполнения функции? Кроме того, +1 для предложения мест, где другие уже решили эту проблему (переходы jquery или css, в частности переход: translate()). – MushinNoShin

setTimeout может работать, но я предвижу, что это вызывает у op намного больше проблем. – Musa

Правда, что. OP должен использовать jquery или css, если это возможно, и перестать пытаться изобрести колесо. – MushinNoShin

удалить кавычки из «счетчика» и после этой строки не использовать «уаг счетчик», просто счетчик + = 1

источник

2013-02-23 19:27:28 d1mitar

Даже если ваш код для установки верхнего стиля был правильным, ваш элемент не будет анимироваться, потому что код не возвращает управление браузеру во время цикла. Вместо этого он будет перемещать все 300 пикселей одновременно.

источник

2013-02-23 19:28:41 Neil

Установить вертикальное положение элемента HTML

ответ

Смежные вопросы