4

外部コントロールを使用して jcarousel をセットアップしました。「コントロール」リストのリンクを「マウスオーバー」すると、カルーセルが対応する画像にスクロールします。

これまでのところすべて正常に動作していますが、さまざまな「コントロール」リンクをすばやく「マウスオーバー」すると、最初のリンクでスタックし、スクロールアニメーションが終了するのを待ちます。

// SCROLL TO LINK
$('#controls a').on('mouseover',function() {
var opt = $('#controls a').index(this)+1; 
carousel.scroll($.jcarousel.intval(opt)); 
}); 

よくわかりませんが、この問題を解決するには、「マウスオーバー」で実行中のスクロール アニメーションを停止する必要があると思います。

私はこれらの行を試しました(これは機能しません):

carousel.stop(true);

と:

carousel.scroll.stop(true);

誰でもこれで私を助けることができますか? おそらく簡単な解決策がありますが、私は一般的に jQuery やプログラミングの経験がありません。

4

3 に答える 3

5

同じ問題がありました。非常に簡単な解決策が見つかりました。「jquery.jcarousel.js」に入れてください

/**
 * Stop animates the carousel, jump To End (animate Slide).
 *
 * @method animate
 * @return undefined
*/
stopAnimate: function() {
this.list.stop(true,true,true);
},

この後

 /**
 * Animates the carousel to a certain position.
 *
 * @method animate
 * @return undefined
 * @param p {Number} Position to scroll to.
 * @param a {Boolean} Flag indicating whether to perform animation.
 */
animate: function(p, a) {
    -/-/-/-/(several strings)
},

私の//リンクへのスクロール//は次のようになります(追加の自動スクロールがあります)

$('#controls a').hover(function() {
        var opt = $("#controls a").index(this) + 1;
        carousel.scroll(opt);
        carousel.stopAuto();//autoScroll Stop
    }, function() {
        carousel.stopAnimate(); //! here is located our function
        carousel.startAuto();//autoScroll Start
    });

多分誰かがそれが役に立つと思うでしょう!

于 2012-12-10T03:34:37.380 に答える
2

特定の div にマウスを合わせると特定の画像を表示する jCarousel コントロールを使用して、同様のコントロールを作成しました。また、スクロール アニメーションが既に再生されている場合、カルーセルが新しいターゲットに到達しないという問題もありました。結局のところ、現在再生中のアニメーションを停止するために必要だったのは、次のコードだけでした...

$(.jcarousel).jcarousel('list').finish();

新しいターゲットを指定する直前にこれを呼び出して、問題を解決しました。これが役立つことを願っています。

于 2014-01-17T19:57:51.200 に答える