3

私は現在、約5つの画像が左に浮いているdivを持っているので、それらは並んでいます。今、この div を親 div 内に overflow:hidden と幅で配置して、4 つの画像しか収まらないようにします。

アニメーション以外はすべて正常に動作します。左右に 2 つの矢印がありますが、右を 2 回押すと通常どおりに移動しますが、左を押すと div の通常の位置がリセットされ、続行します。

$(".next").click(function(){
    $(".item_wrap").animate({right: "+=118px"}, 1500 );
    return false;
});
$(".prev").click(function(){
    $(".item_wrap").animate({left: "+=118px"}, 1500 );
    return false;
});

これは私が現在使用しているコードです。

4

1 に答える 1

2

...しかし、右を2回押すと、通常どおりに移動しますが、左を1回押すと、divの通常の位置がリセットされ、続行されます

それは、要素を実際に引き伸ばす必要がない限り、同じ要素で両方leftをアニメーション化できないためです(ただし、静的な要素の幅を設定した可能性があるため、この場合は引き伸ばされません)。代わりに、1 つだけをアニメーション化します。right加算と減算によるそれらの:

$(".next").click(function(){
    $(".item_wrap").animate({right: "+=118px"}, 1500 );
    return false;
});
$(".prev").click(function(){
    // Subtract from 'right' instead of adding to 'left'
    $(".item_wrap").animate({right: "-=118px"}, 1500 );
    return false;
});
于 2012-08-06T14:55:20.697 に答える