Изменить стиль анимации flexslider после запуска

Я пытался изменить стиль анимации с «Fade» на «Slide» после его запуска, но все потерпело неудачу. Отладка показывает изменение значения свойства, но визуальная анимация не меняется. Я пробовал использовать следующий код, взятый из https://github.com/woothemes/FlexSlider/issues/ 334

slider.setOpts = function(opts) {
  for (var opt in opts) {
    slider.vars[opt] = opts[opt];
  }
  slider.setup();
}

slider.getOpts = function() {
  return slider.vars;
}

а потом

$(myslider).data('flexslider').setOpts({animation: 'swing', easing: 'swing', fade: false });

Кто-нибудь может помочь?

Спасибо


jquery flexslider
person Musa    schedule 27.03.2015    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Попробуйте использовать событие after и остановите/перезапустите ползунок:

    $('.sliderDiv').flexslider({
        after: function (slider) {          
            slider.stop();
            slider.vars.animation = 'swing';
            slider.vars.fade = false;
            slider.play();
        }
    });

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

person cdonner    schedule 01.04.2015
comment
Извините, это не сработало для меня. Кстати, я создаю слайдер из содержимого ajax, поэтому я хочу, чтобы первый слайд отображался как fadeIn, а другие как слайды, но намеренно не удавались :( - person Musa; 03.04.2015
comment
Я еще немного поиграл с этим jsfiddle.net/f46scur2/1, и действительно, тип анимации управляется внутренним свойством затухания, которое не обновляется при вызове setup(init), поэтому фактически его нельзя изменить, если вы не исправите код. Я полагаю, вы могли бы использовать наложение изображения с переходом CSS или два отдельных ползунка, где вы отключаете один с затуханием и включаете один со скольжением на основе ползунка или события таймера. - person cdonner; 04.04.2015