Анимация

[Gefo]

Напишите пжл, как сделать следующую анимацию.

Вообщем получаем строки

<li><li>

Их необходимо показывать друг за другой, применяя анимацию.

.animate({opacity:"toggle"}, "slow")

Спасибо

[Naive]

Лучше юзать slidedown — симпотишней будет, а очередь лучше сделать массивом.

[Gefo]

А е подскажите пожалуйста. Получил я эти самые строчки. Как в js или сразу в цикл, вообщем как создать массив , чтоб потом разобрать в forech

[Naive]

Да на что фантазии хватит, хоть так:

  <style>
    .li {display:none;background:#ebacca;font:28px verdana;}
  </style>
  <ul>
    <li class="li">0</li>
    <li class="li">1</li>
    <li class="li">2</li>
    <li class="li">3</li>
    <li class="li">4</li>
    <li class="li">5</li>
    <li class="li">6</li>
    <li class="li">7</li>
    <li class="li">8</li>
    <li class="li">9</li>
    <li class="li">10</li>
  </ul>
  <script>
    "use strict";
    (function(window, $, undefined){
      var items = $('.li'),
          cb = function(){};
      for (var i = items.length;i--;) {
        (function(item){
          var callback = cb;
          cb = function(){
            $(item).slideDown(700, callback);
          };
        })(items[i]);
      };
      cb();
    })(window, jQuery);
  </script>

[Gefo]

Что т у меня не выходит.

ring.html(result.msg).find(".right ul li").css({display:'none'});
				
var items = $('.right ul li'),
                    cb = function(){};
                for (var i = items.length;i--;) {
                   (function(item){
                        var callback = cb;
                            cb = function(){
                                $(item).slideDown(200, callback);
                            };
                    })(items[i]);
                };
                cb();

Получаю строчки, присвайваю каждой строчке display:'none', после чего работает функция.

Получается так, получаю строки она тут же их заменяет. Никакая анимация не хочет работать.

[Naive]

Что-то я не понял, работает или нет? У меня все путем.

[Gefo]

Вообщем нашел ошибку, работает только так:

	ring.html(result.msg);		
	var items = $('.right ul li'),
     cb = function(){};
        items.css({display:'none'});

Можно ли сделать как нибудь проще код?

[Gefo]

ring.animate({opacity:"toggle"}, "hide");
 ring.html(result.msg);

И не получается, сначала плавно убрать. После чего показать.
Помойму получается, что функция выполняется 2 раза.

[nerv]

как вариант http://learn.javascript.ru/play/LVp6Tb

UPD: ща плагин для себя запилю для разминки пальцев

[Gefo]

Скажите,верней помогите максимально упростить код

        if(time){
		   setInterval(function(){
		        jaix(3,2+'&pm='+id['on'], this, function(result){
			        f.html(result.p); l.html(result.g);	
				    $('.right .hed_inf font').html(result.v)      
		            ring.html(result.msg);	
		            var items = $('.right ul li'),
                    cb = function(){};
                    items.css({display:'none'});
                    for (var i = items.length;i--;) {
                        (function(item){
                            var callback = cb;
                            cb = function(){
                                $(item).slideDown(400, callback);
                            };
                        })(items[i]);
                    };
                    cb(); cl('#jaix');    
		        });	
	        }, time)	
		}else{
		        jaix(3,2+'&pm='+id['on'], this, function(result){
			        f.html(result.p); l.html(result.g);	
				    $('.right .hed_inf font').html(result.v)      
		            ring.html(result.msg);	
		            var items = $('.right ul li'),
                    cb = function(){};
                    items.css({display:'none'});
                    for (var i = items.length;i--;) {
                        (function(item){
                            var callback = cb;
                            cb = function(){
                                $(item).slideDown(400, callback);
                            };
                        })(items[i]);
                    };
                    cb(); cl('#jaix');    
		        });
		}