jquery - jquery roundrrプラグインでアニメーションオンホバーを一時停止

Question

私はこのプラグインを使用しており、アニメーションを設定していautoplay : trueます。しかし、私はアニメーションを停止しmouseoverて再開しmouseoutたいroundrr_container div. コードを編集しようとしましたが、実行できませんでした。これで私を助けてくれませんか。

Answer 1

私はこれを使用していませんが、次のようなものを試してください：

$(document).ready(function() { 
    $('img').hover(function() {    
        $("#roundrr_container").roundrrwheel(  
        {  
            autoplay: false  
        });
    }, function() {
        $("#roundrr_container").roundrrwheel(  
        {  
            autoplay: true 
        });
    });
});

Answer 2

addyosmani には 2 つのイベントがあります。

onImageFocus: 

「ピック」モードで画像がピックの下に表示されたときに実行される関数

onImageBlur:

「ピック」モードで画像がピックの下にない場合に実行される関数

と

hide()//Hide items
show()//show items in roundr

できることは、イベントをonImageFocus使用してhide()アニメーションを停止し、onImageBlur使用show()してアニメーションの効果を再開することです。

だからこのようなものを使う

$(document).ready(function() { 
    $('#roundrr_container').hover(function() {    
       $(this).roundrrwheel(  
    {  
        autoplay: false  
    });
}, function() {
    $(this).roundrrwheel(  
    {  
        autoplay: true 
    });
});
});

Answer 3

最後に、によって解決された問題

<script type="text/javascript">
$(document).ready(function() {                                     $('.my_class').mouseover(function(event)                                                            {                                                                   ap=1;                                                               });                            $('.my_class').mouseout(function(event)                                                              {                                                                   ap=0;                                                                   });
});
</script>`

次に、jquery.roundrr.jsページでチェックしました

最初に関数宣言の前にページ上部で変数 ap を宣言し、次に関数 switchitems ループのコードを次のように変更しました。

function switchItems($m, remove, add, posOffset, direction){if(ap==0){
    if(remove==add) add = remove - 1; 
    var $remove = $($m.raditems()[remove]); 
    var toAddto = $m.raditems()[add]; 
    if(remove>add) $remove.insertBefore(toAddto);
    else $remove.insertAfter(toAddto);
    animateWheel($m,posOffset, direction); }};`