играть в flexslider на hover?

Question

Как я могу сначала остановить flexslider, а затем воспроизвести его при наведении? И дополнительный вызов theres несколько на одной странице. Это работает, но

1. он выходит из строя JQuery и ничего не работает после того, как (какая разметку я пропустил?)

2. , если пользователь переходит на другую вкладку в браузере всей дюжина flexsliders начинает играть одновременно (это потому, что окно нагрузки или что - это не происходит при загрузке страницы только при переключении обратно с другой вкладке браузера)

   $(window).load(function() { 
   
   $('.preview').each(function(index){ 
   
   if($(".preview").eq(index).length) { 
   
   $('.preview').eq(index).flexslider({ 
       slideshowSpeed: 225, 
       animationSpeed: 150, 
       initDelay: 0, 
       useCSS: true, 
       animation: "fade", 
       controlNav: false, 
       directionNav: false, 
       start: function(slider) { 
        $('.preview').removeClass('loading'); 
        slider.pause(); 
        slider.manualPause = true; 
        slider.mouseover(function() { 
         slider.manualPause = false; 
         slider.play(); 
        }); 
        slider.mouseout(function() { 
         slider.manualPause = true; 
         slider.pause(); 
        }); 
       }, 
       keyboard: false 
   }); 
   
   } 
   
   }) 
   
   }); 
   

3. ответ ниже идеально подходит, если у вас есть один слайдер, но у меня есть несколько на той же странице.

(я также уверен, что эк ничего не делает, на самом деле или не настроен правильно)

Answer 1

Удалите start обратного вызова из вашей инициализации и попробовать это:

$(document).on("hover", ".flex-viewport img", function() { 
    $('.preview').play(); 
}, function() { 
    $('.preview').pause(); 
}); 

Answer 2

Ok получил его , Ответ - слайд-шоу: false,

$('.preview').flexslider({ 
    slideshowSpeed: 225, 
    animationSpeed: 150, 
    slideshow: false, 
    initDelay: 0, 
    useCSS: false, 
    animation: "fade", 
    animationLoop: false, 
    pauseOnHover: false, 
    controlNav: false, 
    directionNav: false, 
    start: function(slider) { 
     $('.preview').removeClass('loading'); 
     slider.pause(); 
     slider.manualPause = true; 
     slider.mouseover(function() { 
      slider.manualPause = false; 
      slider.play(); 
     }); 
     slider.mouseout(function() { 
      slider.manualPause = true; 
      slider.pause(); 
     }); 
    }, 
    keyboard: false 
});