0

私は何かひどく間違ったことをしており、その解決策を見つけることができません。

状況: 製品ごとに複数の見積もりがある製品が多数あります。それらの引用はdivで自動的にスクロールします。スクロールが最後の引用に達すると、最初の引用に戻ります。

機能: この関数は基本的に 1 つの div に適用された場合に機能しますが、複数の div に適用された場合、最初の div にスクロールバックしないか、無限にスクロールし続けます。

これは私がこのために書いた関数です:

function quoteSlide(divname){
$total = ($(divname+" > div").size())
$width = $total * 160;
$(divname).css('width', ($width));
console.log ($totalleft *-1);
if ($width - 160 > $totalleft *-1){ 
    $currentleft =  $(divname).css('left');
    $step = -160;
    $totalleft = parseInt($currentleft)+$step;
}else{
    $totalleft = 0;
}

$(divname).animate(
    { 
        left: $totalleft
    }, // what we are animating
    'slow', // how fast we are animating
    'swing', // the type of easing
    function() { // the callback
    });

}

次のようなものによって実行されています: quoteSlide('#quotecontainer_1');setInterval と組み合わせて、自動的にスクロールし続けます。

これは、うまくいかない jsFiddle です (複数の div に適用されます) http://jsfiddle.net/FsrbZ/。これは、すべてがうまくいく jsFiddle です。(1 div に適用)

以下を変更する場合：

   quoteSlide('#quotecontainer_1');
   quoteSlide('#quotecontainer_2');
setInterval(function() {
     quoteSlide('#quotecontainer_1');
     quoteSlide('#quotecontainer_2');
}, 3400);​

に

quoteSlide('#quotecontainer_1');

setInterval(function() {
     quoteSlide('#quotecontainer_1');
}, 3400);​

それは機能します...しかし、1つのquotecontainerでのみです。

4

5 に答える 5

2

これは機能します。Matei Mihaiがすでに述べたように、$totalleft変数は呼び出し間で共有されました。さらに、setInterval呼び出しをquoteSlide()関数に移動したので、繰り返す必要はありません。

変数をquoteSlide()関数に移動したので、すべての呼び出しでその変数の独自のインスタンスを取得します。

JavaScriptについてのもう一つのこと：

  • JavascriptはPHPではありませ$ん。変数の前に-signを付ける必要はありません。個人的には、この規則を使用して、すべてのjQueryオブジェクトの前に。を付け$ます。

callback()PS：訪問者が実際に最初の見積もりを読めるように、への最初の呼び出しを削除することをお勧めします。それがあなたの元のコードで機能した方法であるため、私はそれを含めました。

function quoteSlide(divname) {
    var $totalleft = 0;
    var callback = function() {
        $total = ($(divname + " > div").size())
        $width = $total * 160;
        $(divname).css('width', ($width));
        if ($width - 160 > $totalleft * -1) {
            $currentleft = $(divname).css('left');
            $step = -160;
            $totalleft = parseInt($currentleft) + $step;
        } else {
            $totalleft = 0;
        }

        $(divname).animate({
            left: $totalleft
        }, 'slow', 'swing', function() {});
    };
    callback(); # <-- I would remove this
    setInterval(callback, 3400);
}

quoteSlide('#quotecontainer_1');
quoteSlide('#quotecontainer_2');​
于 2012-09-26T09:42:18.297 に答える
1

まあ、いくつかはより高速でしたが、ここにさらに別の解決策があります、それはうまくいきます：http: //jsfiddle.net/FsrbZ/6/

于 2012-09-26T09:44:53.190 に答える
1

$totalleftこれは、関数がすべての呼び出しで同じ変数を使用するためです。そのため、関数を複数回呼び出すと、$totalLeft変数に格納する数値が正しくありません。

これをチェックしてくださいhttp://jsfiddle.net/FsrbZ/3/

var $totalleft = new Array();
function quoteSlide(divname){
    $total = ($(divname+" > div").size())
    $width = $total * 160;
    $(divname).css('width', ($width));
    if ($width - 160 > $totalleft[divname] *-1){ 
        $currentleft =  $(divname).css('left');
        $step = -160;
        $totalleft[divname] = parseInt($currentleft)+$step;
    }else{
        $totalleft[divname] = 0;
    }

    $(divname).animate(
        { 
            left: $totalleft[divname]
        },
        'slow', 
        'swing',
        function() { 
        });
}
于 2012-09-26T09:36:25.263 に答える
1

これを試して

http://jsfiddle.net/FsrbZ/10/

-490 未満の場合 (カウンターがステップ 4 に到達した場合) に変数をリセットする if ステートメントを追加しました。

于 2012-09-26T09:50:10.000 に答える
0

何について

$total = ($(divname+" div").size())?

http://jsfiddle.net/SnakeEyes/FsrbZ/2/

それがあなたが望むものかどうか教えてください

于 2012-09-26T09:40:28.647 に答える