Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Определение смещения в момент анимации. (https://javascript.ru/forum/jquery/17252-opredelenie-smeshheniya-v-moment-animacii.html)

0931454574 12.05.2011 11:57

Определение смещения в момент анимации.
 
Как определить значение любого из свойтв (top,left и т.д.)в момент протекания анимации. То есть движется обьект и при каждом его смещении на 1 пиксель выполняется проверка условия.

Условие: анимация не должна строиться на цикле, из-за рывков анимации.

П.С. как сами значения свойств определяются писать нет нужды.

0931454574 12.05.2011 12:15

Нашел решение но появилась другая ситуация

<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>


И какую бы скорость в анимации не задавал, она остается одна и та же.

0931454574 12.05.2011 12:22

короче говоря

if ($position_images2 >= "250")


неправильно работает.
То есть с анимацией всё ок,а вот проверка значения хромает.
Наверное полученное значение в строке. Или?

0931454574 12.05.2011 12:29

Ёма, надо же пиксели отбрасывать, черт побери!



Вопрос в следующем. КАК СРАВНИТЬ ЗНАЧЕНИЕ СТИЛЕ (ТОР) с числовым значением?
пробовал replace? parseInt

0931454574 12.05.2011 16:12

Разобрался.
Оказывается 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.

walik 12.05.2011 22:08

А зачем replace'ом убирать "px", ведь parseInt и так это сделает за тебя:
var position = '132px';
alert(parseInt(position));


Что бы останавливать setInterval, воспользуйтесь функцией clearInterval

0931454574 13.05.2011 09:55

walik,
Уже нашел, спасисбо.
Но вот беда, при любом интервале пару пикселей проходят.
Например анимация идет 3000 ,а интервал проверки позиции элемента 1
и в итоге 2 пикселя проскальзывают.


Часовой пояс GMT +3, время: 02:07.