0

このフィドルを見て、「減らす」をクリックしてください。

http://jsfiddle.net/2C8fy/16/

ご覧のとおり、画像は右に跳ね返っています。増加機能ボタンは、正しく機能します。私は問題がこの関数にあることを知っており、特にメモでそれを指摘しました：

 function slide_img_right() {

    var imgs = imgArr.length;
    a--;
    if (a < 0) {
        a = imgs - 1;
    }

    b = a - 1;
    c = a + 1;

    if (b < 0) {
        b = imgs - 1;
    }
    if (c >= imgs) {
        c = 0;
    }

    var left = $('#left_slot');
    var middle = $('#middle_slot');
    var right = $('#right_slot');
    var newImgSR = imgArr[a].clone();

    $('#basic_div').animate({
        left: '+=40px'      // This part is causing the bounce
    }, 300, function() {

    });


    left.attr('id', 'middle_slot');
    middle.attr('id', 'right_slot');


    (newImgSR).insertBefore("#middle_slot");
    newImgSR.attr('id', 'left_slot');
    newImgSR.css('opacity','0');
    newImgSR.fadeTo(300, 1);


    right.animate({
        opacity: 0
    }, 300, function() {
        right.remove();
        $('#basic_div').css({
            left: '0px'               //This part is causing the bounce back.
        });
    });
}

どうやって直せばいいのかわからない。左ではなく幅を変えてみたり、関数内で発生する順番を変えたりしてみましたが、逆方向にのみ増加ボタンのように機能させるにはどうすればよいですか？ありがとう！

4

1 に答える 1

1 
$('#basic_div').css("left","-40px"); //Add this line here.

        $('#basic_div').animate({
            left: '+=40px'      // This part is causing the bounce
        }, 300, function() {

        });

更新されたフィドルを参照してください: http://jsfiddle.net/2C8fy/19/

理由を確認するには、次をご覧ください。

http://jsfiddle.net/2C8fy/20/ここで、その画像をスライドして表示するには、現在の表示領域の外にある必要があることがわかります。

于 2012-04-26T04:02:41.947 に答える