Вопрос

Я сделал слайд -шоу с циклом 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
});
Это было полезно?

Решение

Я думаю, тебе следует:

  1. Сделайте свою собственную функцию для проблемы с обработкой времени (довольно простая функция JS сделает свое дело).
  2. Установите свойство «Тайм-аут» в свои циклы на 0, чтобы оно не было автоматическим.
  3. Используйте доступные команды «Prev» и «Next» в вашей пользовательской функции в этой форме:

$('#slideshow').cycle('next');

Я вижу подход в вашем коде, должен поблагодарить вам отличную идею, которую вы только что дали мне.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top