Передвижение дива
<script language="JavaScript">
function moveTxt() { if (ani1.style.pixelTop < 500) { ani1.style.pixelTop += 2; setTimeout("moveTxt()", 50); } } </script></head> <body onLoad="moveTxt()"> <div id="ani1" style="position:absolute;left:10;top:10">Text ... on the go!</div> Подскажите как добиться кроссбраузерности.. |
document.getElementById('ani1').style…
И пересчет позиции надо так организовать, чтобы можно было еще единицы измерения приписать pixelTop += position + 'px' |
Octane,
// Значение из CSS: var pixelTop = "20px"; // Описанная тобой операция: pixelTop += 20 + "px"; // Результат: alert(pixelTop); // 20px20px |
<body onload="move()">
<script language="JavaScript"> var pos = 'px'; function move() { if (document.getElementById('m1').style.left < 500 pos) { document.getElementById('m1').style.left += 2 pos; setTimeout("move()", 50); } } </script> <div id="m1" style="position: absolute; left:10; top:10"> !!! </div> Подскажите правильно мыслю ? С ява к сожалению только начинаю знакомство... |
Андрей Параничев, да += забыл убрать. Я просто ввел новую переменную, показав, что увеличивать значение мало, нужно еще дописывать единицы измерения.
777: И кстати, что такое pixelTop? Как-то не обратил сразу на это внимания. У объекта style нет свойства pixelTop. Цитата:
Вам свойству left нужно присваивать строку, содержащую число и единицы измерения. …style.left = число + 'px' |
Octane,
У объекта style есть свойство pixelTop. 777, Я поменял задержку на 25 миллисекунд. Для лучшей плавности перехода, поэкспериментируйте с этим показателем.
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript">
var vr2; // Необходимая глобальная переменная, чтобы вовремя остановить задержку
function moveTxt() {
var vr1 = document.getElementById("ani1"); // Ссылка на объект
var x = parseInt(vr1.style.top); // Переменная, которая будет менять расстояние от родительского элемента (сверху по оси х)
x++; // Приращение
vr1.style.top = x + "px"; // Новая координата
if(vr1.style.top == 500 + "px") { //Если расстояние от родительского элемента равно 500 пикселей (сверху по оси х), то задержка останавливается
clearInterval(vr2);
}
}
function setI() {
vr2 = setInterval("moveTxt()", 25); // Задержка
}
</script>
</head>
<body onLoad="setI()">
<div id="ani1" style="position:absolute;left:10px;top:10px">Text ... on the go!</div>
</body>
</html>
|
| Часовой пояс GMT +3, время: 23:33. |