Определение смещения в момент анимации.
Как определить значение любого из свойтв (top,left и т.д.)в момент протекания анимации. То есть движется обьект и при каждом его смещении на 1 пиксель выполняется проверка условия.
Условие: анимация не должна строиться на цикле, из-за рывков анимации. П.С. как сами значения свойств определяются писать нет нужды. |
Нашел решение но появилась другая ситуация
<script>
$(document).ready(function()
{
animate();
});
// определение позиции картинки
function position_of_img()
{
var $position_images=$("#block2").css("left");
return $position_images;
}
// анимация для изображения.
function animate()
{
$div_too_test = $("#block2");
$div_too_test.animate(
{
"left": "+=1000px",
}, "10000", function ()
{
alert(position_of_img());
});
setInterval(function()
{
var $position_images2=$("#block2").css("left");
if ($position_images2 >= "250")
{
$("#block2").css("background-color","green");
}
}, 200);
}
</script>
<div id="block2"></div> И какую бы скорость в анимации не задавал, она остается одна и та же. |
короче говоря
if ($position_images2 >= "250") неправильно работает. То есть с анимацией всё ок,а вот проверка значения хромает. Наверное полученное значение в строке. Или? |
Ёма, надо же пиксели отбрасывать, черт побери!
Вопрос в следующем. КАК СРАВНИТЬ ЗНАЧЕНИЕ СТИЛЕ (ТОР) с числовым значением? пробовал replace? parseInt |
Разобрался.
Оказывается parseInt работал. но из за чего то некоректно работал в условие сравнения. Теперь работает. Привожу пример перевода значения положения элемента
setInterval(function()
{
// берем значение положения в формате "XX.px"
var $position_images2=$("#block2").css("left");
// убираем "px"
$position_images2=$position_images2.replace("px","");
// превращаем в число
$str2 = parseInt($position_images2);
// сравниваем, число можно и в кавычках
if ($str2 >= 900)
{
// меняем стиль
$("#block2").css("background-color","green");
}
else
{
}
}, 10);
Теперь нужно отключить данный setInterval. |
А зачем replace'ом убирать "px", ведь parseInt и так это сделает за тебя:
var position = '132px'; alert(parseInt(position)); Что бы останавливать setInterval, воспользуйтесь функцией clearInterval |
walik,
Уже нашел, спасисбо. Но вот беда, при любом интервале пару пикселей проходят. Например анимация идет 3000 ,а интервал проверки позиции элемента 1 и в итоге 2 пикселя проскальзывают. |
| Часовой пояс GMT +3, время: 12:05. |