Reload .flexslider on resize

Question

Я добавляю класс .flexslider вокруг div, который обертывает теги li, содержащие изображения, моя функция добавляет его, когда окно меньше 767px. Ползунок A. работает только при изменении размера и не включен. Уже, когда экранные прокрутки больше 767 пикселей, я удаляю класс .flexslider, но ползунок все еще инициируется.

function bannerSlider() { 
    "use strict"; 
     if ($(window).width() < 767) {    
      $("#activate-slider").addClass('flexslider'); 
      $("#activate-slider > ul").addClass('slides'); 
     } else if ($Query(window).width() > 767) {  
      $("#activate-slider").removeClass('flexslider'); 
      $("#activate-slider > ul").removeClass('slides'); 
     } 

    } 

Когда Окно 767px или больше HTML код выглядит следующим образом

 <div id="activate-slider"> 
      <ul> 
      <li>myimage</li> 
      <li>myimage</li> 
      </ul> 
     </div> 

Когда Окно 767px или меньше HTML код выглядит следующим образом

 <div id="activate-slider" class="flexslider"> 
      <ul class="slides"> 
      <li>myimage</li> 
      <li>myimage</li> 
      </ul> 
     </div> 

Быстрый Recap, хотите слайдер для запуска, если экран окна (мобильные устройства) меньше, чем 767 пикселей, а не только для изменения размера, я могу просмотреть мой код и найти там, где я ошибся там, скорее всего, основная проблема: DEACTIVATING ползунок, когда окно возвращается ABOV E 767px.

я бег моей функции внутри document.ready window.resize & попытался внутри window.load Логически я могу видеть, где он не работает так, как я хотел бы, но я не могу понять, что написать, чтобы сделать на работает должным образом.

Answer 1

Вы пытались приостановить/сыграть в flexslider?

function bannerSlider() { 
    "use strict"; 
    if ($(window).width() <= 767) {    

     $("#activate-slider").addClass('flexslider'); 
     $("#activate-slider > ul").addClass('slides'); 

     if ($('.flexslider').flexslider('animating') == false) { 
      $('.flexslider').flexslider('play') ; 
     } 

    } 
    else if ($Query(window).width() > 767) {  

     if ($('.flexslider').flexslider('animating') == true) { 
      $('.flexslider').flexslider('pause') ; 
     } 

     $("#activate-slider").removeClass('flexslider'); 
     $("#activate-slider > ul").removeClass('slides'); 
    } 
} 

Answer 2

в JS из FlexSlider

find-> slider.doMath примерно 950-960 линии ни в уменьшенной версии

затем добавить код ниже

в MaxItems и до slider.w snipet

var w = $(window).width(); 
 
       var h = $(window).height(); 
 
       console.log("w " + w); 
 
       console.log("h " + h); 
 
       if (w > 1025) { 
 
        maxItems = slider.vars.maxItems; 
 
       } 
 
       else if (w = 1020) { 
 
        maxItems = 3; 
 
       } 
 
       else if (w >= 568) { 
 
        maxItems = 2; 
 
       } 
 
       else if (568 > w) { 
 
        maxItems = 1; 
 
       }