ホバーでスライドを一時停止する

Question

特定のスライドをマウスで動かすと、そのスライドが止まります。

javascriptのコードは、私が試した：

$(".rotate-slider").hover(function() { 
    $(this).find(".rotate-slider").stop(true, true).fadeOut(); 
}, function() { 
    $(this).find(".rotate-slider").stop(true, true).fadeIn(); 
}); 

はまた、私はそれを得るために、CSSを使用しようとしました：

.rotating-slide:hover .slider 
{ 
    -webkit-animation-play-state: paused; 
    -moz-animation-play-state: paused; 
    -o-animation-play-state: paused; 
    animation-play-state: paused; 
} 

残念ながら、上記のコードのいずれも動作していないようにみえます。

Answer 1

あなたはここに更新されたコードを確認することができます。jsfiddle.net/bharatsing/mqv1w538/8/

をあなたはユーザーてclearIntervalホバーとホバー出て再びlot.You genius.Godが祝福

$(".rotate-slider li").hover(function() {  
    clearInterval(rotateInterval); 
}, function() { 
    rotateInterval = window.setInterval(function(){ 
       if(!rotateSlider.slidesContainer.hasClass('animate')){ 
        rotateSlider.slidesContainer.addClass('animate') 
       } 
       currentRotation = currentRotation - rotateSlider.slideAngle; 
       rotateSlider.slidesContainer.css('transform', 'translateX(-50%) rotate('+currentRotation+'deg)'); 
      }, 4000); 
});