Показать сообщение отдельно
  #6 (permalink)  
Старый 18.05.2013, 00:19
Новичок на форуме
Отправить личное сообщение для alx1 Посмотреть профиль Найти все сообщения от alx1
 
Регистрация: 17.05.2013
Сообщений: 4

Deff,
Огромное спасибо за идею,
тк язык JS и его токости я не знаю получилось криво но получилось, в смысле работает последовательно, пришлось делать через callback функции animate, для анимации сортировки масива из 10 элементов получается 78 вызов метода и строка('st') в 5000 символов длиной

<!DOCTYPE html>
<html>
 <head>
	  <meta charset="utf-8">
	  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
	  <script>
	    var animArray = new Array(); //сюда кладу анимацию последовательно ввиде строк(( пло другому не знаю как парсить
		
	   //обработка массива анимации, рекурсивно достает элементы  из масива и собирает строку
	   function extrAnimArray(i){
			var s;
			if (i>animArray.length-1) { return " );"; }
			else {
				if (i ==0) {s = animArray[i]+extrAnimArray(i+1)}
				else {
					s = ", function(){"+animArray[i]+extrAnimArray(i+1)+"});"
				}
			}
		return s;
		}			
		
		function  create() {
	         
	        for (i=0;i<=2;i++){
	        // было    
			//	$("#xs"+String(i)).animate({left:String($("#xs"+String(i)).position().left+100)+"px"},1000);
			//
			//изменил на заполнение массива анимаций
			s="$(\"#xs"+String(i)+"\").animate({left:\""+String($("#xs"+String(i)).position().left+100)+"px\"},1000" ;//завершающую скобку специально не ставлю(чтобы потом не удалять, да и не знаю как это на js делается)
			animArray.push(s); //поместим строку в массив
 		
				
	        }
	        
		//тут я вызываю обработку массива анимации
		st = extrAnimArray(0);
		//первая функция которая мне попалась которая может из строку выполнить как функию... 
		setTimeout(st, 1000);
			
	   }
	   
	</script>
	 </head>
	 
	 <body>
	 <input type="button" onclick="create()" value="dvigaem" />
	       
	<div style="position: absolute; line-height:0px;width: 1000px;height: 400px;background: #cccccc;">
	 
	<div id="xs0" style="position: absolute;top:00px;left:0px; width: 40px;height: 40px;background: #ff0000;" >1</div>
	<div id="xs1" style="position: absolute;top:50px;left:0px; width: 40px;height: 40px;background: #00ff00;" >2</div>
	<div id="xs2" style="position: absolute;top:100px;left:0px; width: 40px;height: 40px;background: #0000ff;" >3</div>
	 </div>
	  
	 </body></html>

Последний раз редактировалось alx1, 18.05.2013 в 00:25.
Ответить с цитированием