Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.12.2012, 23:11
Аватар для Alice
Новичок на форуме
Отправить личное сообщение для Alice Посмотреть профиль Найти все сообщения от Alice
 
Регистрация: 01.02.2012
Сообщений: 6

Поочередное применение эффектов
Всем здравствуйте!

Имеется три блока, как осуществить поочередную анимацию, т.е. сначала появляется первый блок, как только его анимация закончилась, второй, третий и т.д. ?
Предполагаю, что должен быть какой-то цикл, но он работает не так, как мне бы хотелось, т.е. выводит все три блока одновременно.

Буду благодарна любому совету, может подскажите где и что почитать

<script>
$(document).ready(function(){
$("div").each(function(){
$(this).effect("slide",{
            mode: "show",
            direction: "right"
    }, 500)
})
})
</script>

<div id="div1">Текст 1</div>
<div id="div2">Текст 2</div>
<div id="div3">Текст 3</div>

Последний раз редактировалось Alice, 16.12.2012 в 23:18.
Ответить с цитированием
  #2 (permalink)  
Старый 16.12.2012, 23:32
Аспирант
Отправить личное сообщение для Sanda Посмотреть профиль Найти все сообщения от Sanda
 
Регистрация: 12.10.2012
Сообщений: 90

Используете jQueryUI?
jQueryUI Effect
Обратите внимание на четвёртый параметр (complete) - это функция, которая выполняется после завершения анимации.
Ответить с цитированием
  #3 (permalink)  
Старый 16.12.2012, 23:47
Аватар для Alice
Новичок на форуме
Отправить личное сообщение для Alice Посмотреть профиль Найти все сообщения от Alice
 
Регистрация: 01.02.2012
Сообщений: 6

Да.
Да, я пыталась колдовать с вызовом обратной функции, но что-то должного результата опять же, не принесло.
Целый день сижу с этой проблемой, много чего было перепробовано и setTimeOut(), .queue() и пр., но что-то мозг подводит, сообразить не могу.
Ответить с цитированием
  #4 (permalink)  
Старый 16.12.2012, 23:59
Аспирант
Отправить личное сообщение для Sanda Посмотреть профиль Найти все сообщения от Sanda
 
Регистрация: 12.10.2012
Сообщений: 90

Не тестировал, поэтому может не работать, но что-то типа такого:
function sequentialEffects(elems, index) {
  index = index || 0;
  if (!elems[index]) return;
  elems.eq(index).effect(
    'slide'
    , {
      mode: 'show'
      , direction: 'right'
    }
    , 500
    , function () {
      sequentialEffects(elems, index + 1);
    }
  );
}

sequentialEffects($('div'));
Ответить с цитированием
  #5 (permalink)  
Старый 17.12.2012, 00:01
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Сообщение от Alice
Поочередное применение эффектов
Вызов следующего эффекта по завершении первого в функции сallback
$("p").animate({
       height:200, width:400, opacity: .5
    }, 1000, "linear", 
*!*
function(){alert("Вместо alert, вызов следующего эффекта");
*/!*
} );
Ответить с цитированием
  #6 (permalink)  
Старый 17.12.2012, 00:52
Аватар для Alice
Новичок на форуме
Отправить личное сообщение для Alice Посмотреть профиль Найти все сообщения от Alice
 
Регистрация: 01.02.2012
Сообщений: 6

Sanda,
Спасибо большое, работает все прекрасно.
Deff,
Вам также спасибо, что ответили
Ответить с цитированием
  #7 (permalink)  
Старый 17.12.2012, 14:18
Аватар для nerv_
junior
Отправить личное сообщение для nerv_ Посмотреть профиль Найти все сообщения от nerv_
 
Регистрация: 29.11.2011
Сообщений: 3,924

http://api.jquery.com/jQuery.queue/
http://jquery.page2page.ru/index.php...%D0%B8%D0% B9
__________________
Чебурашка стал символом олимпийских игр. А чего достиг ты?
Тишина - самый громкий звук
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Применение функции с таймаутом к нескольким элементам vvsh Элементы интерфейса 1 12.04.2012 10:54
применение Web Socket bot87 Общие вопросы Javascript 10 25.02.2012 20:26
Поочередное появление элементов <tr> gromitsu jQuery 3 27.11.2011 21:20
Ищу маленькую библиотеку эффектов `p r o x y Библиотеки/Тулкиты/Фреймворки 0 20.06.2011 06:56
Визуальный редактор javascript эффектов дождя снега пузырей hyhy Элементы интерфейса 2 21.10.2010 17:12