Мне нужно выполнять довольно сложные анимации на моем веб-сайте, где элементы перемещаются вверх и вниз, манипулируют свойствами CSS и так далее. Интересно, как это сделать элегантно.
Действия запускаются по клику, еще один клик должен вернуть все, пока сайт снова не вернется в исходное состояние.
Что я не хочу делать, так это написать функцию типа
$(somebutton).onclick(function() {
if($(this).hasClass("clicked") {
$(this).slideDown();
$('#that').show();
$('#button').css("position","absolute");
// more things going on
} else {
// revert all things gone on
$(this).slideUp();
$('#that').hide();
$('#button').css("position","static");
}
});
Это означает, что я не хочу писать все эти утверждения дважды, или, что еще хуже, большинство анимаций одинаковы в 70%. Я не хотел писать это снова и снова.
То, о чем я думал, было чем-то вроде очереди анимации, которой я могу манипулировать, выдвигать и сдвигать и, самое главное, возвращать. Я нашел jQuery queue () - функция, но есть один момент, который я застрял:
после того, как пользовательская очередь снята с производства, ее больше нет, это означает, что я могу анимировать элемент один раз, но я не могу сказать, например,
myQueue.queue ( 'живой') обратное ();.
после того, как myQueue был запущен, потому что на данный момент он пуст.
Это длинное объяснение не только для этой простой проблемы очереди. Это также приглашение предложить идеи для лучшего способа сделать это.