0

ほとんどの部分で機能するこのギャラリーを構築しました。問題は、右矢印をクリックすると、ギャラリー アイテムが画面からスライドして空になり、次の画像が表示されるだけです (次の画像が一緒にスライドするのではなく)。左矢印を押すと逆になり、ギャラリーの画像がすぐに消えて、新しい画像にスライドします。何が起こっているかについて何か考えはありますか？ここに行くと、私が話していることがわかります: http://jsfiddle.net/grem28/dhUEc/

ここにjsがあります：

$(function(){

    var curImg = 0;

    $('#leftArrow a').click(function(e){
            e.preventDefault();

            if(curImg!=0){      
                curImg--;

                $('.image_reel').css('left','+=323px');

            }else{
                curImg = ($('.image_reel img').size()-1);
                $('.image_reel').css('left',-($('.image_reel img').width()*($('.image_reel img').size()-1)));
            }

    });

    $('#rightArrow a').click(function(e){
        e.preventDefault()

            if(curImg==($('.image_reel img').size()-1)){
                    curImg = 0;

                $('.image_reel').css('left','0px');

            } else {
                curImg++;

                $('.image_reel').css('left','-=323px');
            }

    });

});
4

1 に答える 1

0

削除するoverflow: hiddenと、実際に何が起こっているかがわかります。

http://jsfiddle.net/dhUEc/1/

画像は実際には下にあり、収まるスペースがある場合にのみポップアップします。画像から を削除して、画像リールにfloat追加することをお勧めします。追加して、画像間のすべてのスペースを削除するwhite-space: nowrapこともできます。font-size: 0

.image_reel {
    white-space: nowrap;
    font-size: 0;
    /* ... */
}

http://jsfiddle.net/dhUEc/3

于 2013-11-06T21:52:09.277 に答える