jQuery Cycle - динамическое изменение параметров - PullRequest
Новая
       15

jQuery Cycle - динамическое изменение параметров

3 голосов
/ 22 февраля 2012

Вопрос:

Как бы я мог асинхронно изменять параметры jQuery Cycle при помощи мыши с элементами HTML?

jsFiddle

Вот рабочий пример. Обратитесь к комментариям для уточнения намерений

Проведенные исследования:

Этот твит от автора цикла показывает, что можно асинхронно изменять параметры цикла.

Я спросил его в последующем твите, может ли он изложить тему, и он сказал (перефразируя) «продолжай скрываться."

После изучения исходного кода цикла я обнаружил, что он не лгал.cycle.opts, действительно, существует, и есть также функция debug, которая, по-видимому, заслуживает упоминания.Тем не менее, я очень мало представляю, как использовать эти функции.

Я могу вернуть состояние объекта, используя cycle.opts, но это аспект "... и затем изменить то, что вам нужно", который я могуне выяснить.Я просмотрел справочную страницу для параметров , и значения по умолчанию для других параметров не отображаются так, как если бы они мешали.

Ответы [ 2 ]

3 голосов
/ 22 февраля 2012

Ну, если я что-то упустил, вы вообще не меняете параметры в своем коде.Попробуйте это: 

$('#foo').mouseover(function(){
    var changedOpts = $('.shuffle').data('cycle.opts')
    changedOpts.speed = 0;
    $('.shuffle').data('cycle.opts', changedOpts);
});
1 голос
/ 20 июля 2012

С вашим методом поведение паузы при наведении не может изменяться динамически после начальной настройки.Обходной код выложен ниже.

Я не смог заставить это работать на основе примера jsFiddle в вашем вопросе.

В моем случае я хотел, чтобы слайд-шоу повторялось как обычно,но активация паузы при наведении курсора после того, как пользователь щелкает изображение в первый раз.

После некоторой отладки кажется, что определенные параметры, которые я хотел динамически изменить, а именно, «pause» и «pauseOnPagerHover», неприменять после настройки слайд-шоу в первый раз.

Не выяснив фактическую причину этого, я собрал рабочее решение моей проблемы ниже: 

// After toggling image manually the first time by clicking it, enable pause on hover.
$('.slideshow-image-link').click(function (e) {
    e.preventDefault();
    // When clicked the first time, set up a hover event pausing the slideshow.
    // It seems like changing the 'pause' option can't be done dynamically after
    // setting up the slideshow cycle.
    $('#slideshow-images').cycle('pause');
    $('.slideshow-image-link').hover(
        function () {  // On mouse in.
            $('#slideshow-images').cycle('pause');
        },
        function () {  // On mouse out.
            $('#slideshow-images').cycle('resume');
        }
    );
});

Вот jsFiddle демонстрирует код выше.

...