2

Jqueryサイクルを使用していて、水平方向に連続してスクロールしています。ユーザーがカーソルを合わせたときにアニメーションを停止したいと思います。プラグインの「pause:1」オプションを使用してこの機能を実行していますが、次の画像に循環するまで一時停止しません。これは低速です。ユーザーがホバリングしたときにアニメーションの途中で一時停止したいので、画像の中間であっても、マウスアウトで再開します。これは可能ですか?

私のコード:

$('.gallery .continuous').each(function(index, element) {   
    $(element).cycle({ 
        fx:'scrollHorz',                
        continuous: 1,
        speed:10000,
        timeout:0,
        easing: 'linear',
        pause:1,
        pauseOnPagerHover: true,
    });
});

助けてくれてありがとう。

4

2 に答える 2

2

こんにちはデズモンド、あなたの JavaScript でこれを試すことができます。書類にまとめて準備

    $('.gallery .continuous').hover(
function(){
$(this).cycle('pause');  //Pauses the cycle on hover
},
function(){
$(this).cycle('resume'); // Resumes the cycle when mouse is outside div
});

うまくいくことを願っています。

于 2012-08-09T03:43:20.083 に答える
-1
<div id="slider">
        <img class="images" src="1.jpg">
        <img class="images" src="2.jpg">
        <img class="images" src="3.jpg">
        <img class="images" src="4.jpg">
    </div>

<!-- for example above mentioned is your html with container with id "slider"

then cycle code will be like that -->


    <script>
    //this is your cycling code!!!!!!!!!!!!!!!
      $('#slider').cycle({ 
        fx:      'scrollHorz', 
        timeout:   200,
        speed:   1000,
        next: '.right',
        prev: '.left'
    });

//if you want to pause you need to use .cycle("pause") for e.g:

//on mouseover.

        $('#slider').mouseover(function(){
            $('#slider').cycle('pause');
        });


    //and continue on mouse out

        $('#slider').mouseout(function(){
            $('#slider').cycle('resume');
        });

    </script>
于 2017-07-31T21:20:04.630 に答える