Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> jquery отслеживание завершения нескольких анимации, а сами анимации создаются в цикле 
V
    Опции темы
Frozen_Coyote
Дата 11.6.2013, 13:58 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 230
Регистрация: 20.9.2007

Репутация: нет
Всего: нет



Приветствую,

подскажите - возможно ли мне каким то образом, может через $.when или как то через коллбэк (как?) отследить завершение нескольких анимаций, которые стартуют в неком цикле? Пример

Код


for(var x = 0; x < col; x++)
{
       $("#id" + x).animate( 
       {
           "top": "100px" 
        }, 300);
}



Дело в том, что количество анмимаций заранее неизвестно - может подскажете какой то другой способ формирования списка анимаций и старта оных с последующим перехватом? Через $.when then схема работат (ну во всяком случае, как я смог допереть) если четко в условие вставляешь фиксированное количество анимашек типа

Код

$.when(

$("#id1").animate( 
       {
           "top": "100px" 
        }, 300),

$("#id2").animate( 
       {
           "top": "100px" 
        }, 300);

).then( alert('Все отбегались') );


а как быть с динамическим количеством анимаций?

спасибо!
PM MAIL   Вверх
z-END
Дата 11.6.2013, 14:01 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прафесар™
****


Профиль
Группа: Комодератор
Сообщений: 3014
Регистрация: 13.3.2003
Где: Венья, Пиетари

Репутация: 3
Всего: 102



может так...
Код

 $("#id" + x).animate( {"top": "100px" }, 300,function(){
if ($(this).not(':animated')) alert('animation ends');
});


Это сообщение отредактировал(а) z-END - 11.6.2013, 14:04


--------------------
Каждый чилавек пасвоему праф...а памоему НЕТ! 

PM WWW ICQ   Вверх
Frozen_Coyote
Дата 11.6.2013, 14:11 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 230
Регистрация: 20.9.2007

Репутация: нет
Всего: нет



как мне видится данный код будет по завершению КАЖДОЙ анимашки радостно уведомлять о завершении анимации данного эземпляра, а мне же необходимо чтобы при завершении динамического количества запущенных анимаций был ЕДИНЫЙ перехват завершения ВСЕХ анимаций. Ну т.е. все отбегались и на экране ОДИН ОБЩИЙ alert('Анимация всех завершилась'). Или я неправ?
PM MAIL   Вверх
z-END
Дата 11.6.2013, 14:23 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прафесар™
****


Профиль
Группа: Комодератор
Сообщений: 3014
Регистрация: 13.3.2003
Где: Венья, Пиетари

Репутация: 3
Всего: 102



Цитата(Frozen_Coyote @  11.6.2013,  15:11 Найти цитируемый пост)
Или я неправ?

всякое бывает) 

но если в рамках callback окончания анимации селектор :animated срабатывает некорректно, а оборачивать его в setTimeout лень, то тогда в помощь  queue dequeue  )


--------------------
Каждый чилавек пасвоему праф...а памоему НЕТ! 

PM WWW ICQ   Вверх
Frozen_Coyote
Дата 11.6.2013, 14:26 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 230
Регистрация: 20.9.2007

Репутация: нет
Всего: нет



дело не в лени а в грамотном решении задачки с минимальными нагрузками на проц )) спасибо )
PM MAIL   Вверх
Amphiluke
Дата 11.6.2013, 15:02 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


   ☽
***


Профиль
Группа: Завсегдатай
Сообщений: 1253
Регистрация: 26.8.2009

Репутация: 17
Всего: 112



Цитата(Frozen_Coyote @  11.6.2013,  17:58 Найти цитируемый пост)
Через $.when then схема работат

Цитата(Frozen_Coyote @  11.6.2013,  17:58 Найти цитируемый пост)
а как быть с динамическим количеством анимаций?


Очень просто можно реализовать и через $.when(). Добавляйте соответствующие анимациям Promise-объекты в динамический массив, а затем применяйте метод $.when при помощи apply. Мне кажется, это решение через $.Deferred вполне себе элегантное.

Код

var promises = [];
for(var x = 0; x < col; x++) {
    promises.push($("#id" + x).animate({top: "100px"}, 300));
}
$.when.apply($, promises).done(function () {
    alert('Все отбегались');
});


Это сообщение отредактировал(а) Amphiluke - 11.6.2013, 15:03
PM   Вверх
Frozen_Coyote
Дата 11.6.2013, 15:21 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 230
Регистрация: 20.9.2007

Репутация: нет
Всего: нет



Цитата(Amphiluke @  11.6.2013,  15:02 Найти цитируемый пост)
Мне кажется, это решение через $.Deferred вполне себе элегантное.



вот спасибо уважаемый! получилось в лучшем виде!!!! Спасибо!
PM MAIL   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Применение библиотек | Следующая тема »


 




[ Время генерации скрипта: 0.1545 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.