2017-01-10 5 views
1

彼は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; 
} 

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

答えて

3

使用このような何か:

$(".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); 
 
});

関連する問題