Плагин jQuery Cycle Увеличение масштаба вместо постепенного увеличения

У меня есть много разделов с изображениями (плитками), которые я хотел бы отображать одно за другим при открытии сайта. Плагин jQuery Cycle поддерживает это, используя:

$('#slideshow img:first').fadeIn(1000, function() {
    $('#slideshow').cycle();
});

Это отлично работает, однако я хотел бы внести некоторые коррективы в эту анимацию, которые я не могу сделать сам, потому что я просто недостаточно знаю о jQuery и JS в целом. Я пробовал грубо, но все усилия были тщетны.

Я бы хотел:

  • Изображения должны появляться одно за другим. Насколько я знаю, в этом плагине нет опции «пауза». Есть ли вариант, чтобы я мог удерживать анимацию в течение нескольких миллисекунд перед ее запуском?

  • Приведенный выше код постепенно увеличивает изображение, но я хотел бы, чтобы оно увеличивалось/исчезало. Таким образом, кажется, что плитка всплывает.

Заранее спасибо!


person mat    schedule 18.05.2012    source источник


Ответы (1)


Обновить

Вы можете использовать задержку jquery для достижения этого:

$('#slideshow').cycle({fx:'fadeZoom'}).pause().delay(5000).resume();

Оригинальный ответ

В плагине есть все опции, которые вы вроде бы описываете:

Для справки здесь параметры: http://jquery.malsup.com/cycle/options.html

$('#slideshow').cycle({fx: 'fadeZoom', delay: 1000}); это то, что вы хотите назвать. Эффект определяет анимацию, а задержка задерживает начало цикла.

Вот список всех анимаций: http://jquery.malsup.com/cycle/browser.html

person lucuma    schedule 18.05.2012
comment
Я тоже зашел так далеко, но проблема в том, что задержка игнорируется на первом изображении. Таким образом, изображение выглядит как статическое изображение с самого начала. Я хотел бы, чтобы он появлялся при загрузке сайта. - person mat; 18.05.2012
comment
Я ценю вашу помощь и мне нравится то, что вы здесь сделали, но я просто хотел бы увеличить одно изображение. В отправленной вами скрипке вы разместили слайд-шоу, которое начинается с изображения. Я хочу начать с пустого места и увеличить его с помощью изображения. Итак, плитки встали на свои места. - person mat; 21.05.2012
comment
Для вашего первого изображения Пробовали ли вы пустой .gif/spacer.gif? Вы также можете удалить его. Я не уверен, что вы пытаетесь сделать. - person lucuma; 21.05.2012
comment
Креативное решение lucuma! Я думаю, что это должно сработать, поэтому я принял ваш ответ. Это не официальный маршрут, поэтому, если у кого-то еще есть предложения, дайте мне знать! Пока я буду использовать это. :) - person mat; 21.05.2012