jQuery Cycle - две анимации в одном цикле
-
11-10-2019 - |
Вопрос
Я сделал слайд -шоу с циклом jQuery, но у меня есть проблема с таймерами. После пары циклов они испортят. Как я могу объединить две цикл анимации в одной функции и с одним таймером?
Спасибо за любую помощь.
xhtml:
<div id="slideshow">
<ul>
<li>
<div class="image"><img src="test.jpg" /></div>
<div class="description">Some text goes here</div>
</li>
<li>
<div class="image"><img src="test.jpg" /></div>
<div class="description">Some text goes here</div>
</li>
<li>
<div class="image"><img src="test.jpg" /></div>
<div class="description">Some text goes here</div>
</li>
</ul>
</div>
jQuery:
var img = $(this).find('#slideshow div.image');
var desc = $(this).find('#slideshow div.description');
$('#slideshow ul').cycle({
fx: 'scrollHorz',
speed: 'fast',
timeout: 5000,
next: '.next',
pause: 1,
slideExpr: img
});
$('#slideshow').cycle({
fx: 'scrollVert',
speed: 'fast',
timeout: 5000,
next: '.next',
pause: 1,
slideExpr: desc
});
Решение
Я думаю, тебе следует:
- Сделайте свою собственную функцию для проблемы с обработкой времени (довольно простая функция JS сделает свое дело).
- Установите свойство «Тайм-аут» в свои циклы на 0, чтобы оно не было автоматическим.
- Используйте доступные команды «Prev» и «Next» в вашей пользовательской функции в этой форме:
$('#slideshow').cycle('next');
Я вижу подход в вашем коде, должен поблагодарить вам отличную идею, которую вы только что дали мне.
Не связан с StackOverflow