1

ループする連続スライダー画像を作成しようとしていますが、それを機能させることに成功しましたが、画像が再び丸くなるまで、トランジションの大部分が空白であるという問題に直面しています。

事前のおかげで、画像をエンドツーエンドでループさせて、トランジションにギャップがないようにする方法を探しています

http://jsfiddle.net/Antifaith/tqBMQ/

編集：

わかりました。別の画像で試してみましたが、脳出血を引き起こしていたので、別のアプローチを取り、アニメーションの特定の位置に到達したときにifステートメントを起動しようとしました。問題はslidetown（）を起動することだけです。1秒間に何億回も動作を停止します-私は今朝他の何かに割り当てられており、本当に助けを借りることができます！

http://jsfiddle.net/Antifaith/tqBMQ/1/

$(document).ready(function slidetown(){
$('.rotation').animate({'left' : '960px'} , {

    duration: 15000, 
    easing : "linear",
    complete: function() {
      $(this).css('left','-2028px');
      slidetown();
    }
  });
 var pos = $('.rotation').position();
        if (pos.left < 0) {
           slidetown();
        }
});
4

1 に答える 1

0

トリックは、1つの大きな画像ではなく複数の画像を使用することかもしれないと思います。発生している問題は、アニメーションに指定した960pxの領域から画像が外れるまで、アニメーションが再開されないことです。

ただし、画像を適切な場所で切り取った場合（画像内の論理的で状況に応じた分割を把握することをお勧めします）、最初の画像は、シーケンスで再び画像に到達するまでにページから外れるはずです。

于 2012-04-23T16:51:31.593 に答える