0

ここですでに解決策を探しましたが、残念ながら何もうまくいきませんでした。

ページの左から右に飛んでいくアニメーション化された雲がいくつかありますが、どうすればこのアニメーションを繰り返すことができますか?

私のコード:

(JS)

$(window).load(function animation() {   
  $(".big_cloud").delay(5000).animate( { marginLeft: '100%' }, speed, 'linear');
  });

(CSS)

.big_cloud {
background-image: url('images/big_cloud.png');
width: 272px;
height: 174px;
cursor:pointer;
position: absolute;
margin-left: -280px;
z-index: 3;
}

(HTML)

<div class="big_cloud"></div>

たとえば、雲がページの真ん中に入った後、繰り返しを開始することは可能ですか?

ありがとう!

4

2 に答える 2

3

このようなものはあなたが望むものを達成しますか

http://jsfiddle.net/uxyFE/

アニメーションが完了したら、既存のクラウドを移動して負のマージンを設定し、関数を再度呼び出します。もちろん、これは一度に 1 つの雲しか存在しないことを意味します。

于 2012-07-13T12:09:00.413 に答える
0

このようなもの?

$(".big_cloud").everyTime((speed * 2), function (){
    $(".big_cloud").animate({ marginLeft:'100%' }, speed, 'linear').animate({ marginLeft:'0%' }, speed, 'linear');
});

ソース: http://www.irengba.com/codewell/

于 2012-07-13T10:52:53.883 に答える