jQuery плагин цикла с различными значениями времени ожидания для каждого слайда

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

Это моя неработающая попытка:

$('.featureFade').cycle({cycleTimeout: 10, after: onCycleAfter});

function onCycleAfter() { 
    $('.featureFade').cycle('pause');
    var duration = $(this).attr('class').substring($(this).attr('class').indexOf('dur')+3)
    setTimeout(oncycleEnd, duration * 1000); 
}
function oncycleEnd() { 
    $('.featureFade').cycle('resume');
}

Это возможно с циклом? Если нет, есть ли другой плагин, который будет работать? Мне не нужны причудливые эффекты, достаточно просто исчезнуть и исчезнуть.

Большое спасибо

1 ответ

Решение

Есть timeoutFn вариант, который вы можете использовать, например:

$('.featureFade').cycle({
  timeoutFn: function(currElement, nextElement, opts, isForward) { 
    var duration = $(currElement).attr('class').substring($(currElement).attr('class').indexOf('dur')+3)
    return duration * 1000;
  }
});

Однако вместо класса вы можете использовать атрибут данных, что-то вроде этого:

<img data-duration="2000" src="..." />

Тогда ваш код немного проще:

$('.featureFade').cycle({
  timeoutFn: function(currElement, nextElement, opts, isForward) { 
    return parseInt($(currElement).attr('data-duration'), 10);
  }
});
Другие вопросы по тегам