задержка JQuery между двумя анимаций

Question

Код:

$("#telecomGrayscale", this).stop().animate({ top: '467px' }, 
    { duration: 400 }).delay(800).queue(function() { 
       $("#boxcaptionTelecom", this).stop().animate({ top: '272px' }, { duration: 900 }); 
       }); 

Приведенный выше код не работает, как требуется. Вторая анимация, находящаяся внутри очереди(), не работает .

Мне просто нужно отложить вторую анимацию. Также попробовали setTimeout и setInterval не могли заставить их работать.

Answer 1

В вашей второй анимации, this не то, что вы думаете, что это, поэтому селектор с this в качестве контекста, скорее всего, пустой.

Попробуйте, если это работает:

var self = this; 
$("#telecomGrayscale", self) 
    .stop() 
    .animate(
     { top: '467px' }, 
     { duration: 400 } 
    ) 
    .delay(800) 
    .queue(
     function() { 
      $("#boxcaptionTelecom", self) 
       .stop() 
       .animate(
        { top: '272px' }, 
        { duration: 900 } 
       ); 
      return $(this).dequeue(); 
     } 
    ); 

Answer 2

Я думаю, что это должно быть в цепи:

$("#telecomGrayscale", this).stop().animate({ top: '467px' }, 
{ duration: 400 }).delay(800).animate({ top: '272px' }, { duration: 900 }); 

редактировать: Простите мою ошибку. Если вы хотите сделать это на двух разных элементах, тогда вы должны сделать первый параметр queue() 'fx', а затем, в качестве второго параметра вашей функции. Посмотрите на функции документации на http://api.jquery.com/queue/