0

こんにちは私はこのような2つの背景を持つdivを持っています：

<div class="colCenter" style="height: 750px; top: -25px; width: 72%; left: 18%; background-image: url('img/sfondi/portfolio.jpg'), url('img/sfondi/servizi.jpg');background-position: 0px 0px, 0px -1440px;">
</div>

クリックした後、アニメーション化しようとしても機能しないのはなぜですか？これが私のコードです：

$(".colCenter").on("click", function() {
    $(".colCenter").animate({
          'backgroundPositionY': '1440px 0px'
    }, 1500, 'linear');
});

アニメーションで私はすでに試しました：'background-position': '0 1440px, 0 0px'そして'backgroundPositionY': '1440px, 0px'

私はFirefox16で作業しており、divの背景以上のものがサポートされています

4

1 に答える 1

1

なんで？

http://api.jquery.com/animate/は、次のように述べています。

アニメーション化されたすべてのプロパティは、単一の数値にアニメーション化する必要があります

複数の背景には複数の数値が必要です。jQueryは、要求されたアニメーションを「理解」しません。

では、どうやって？

実行したいアニメーションを解釈するjqueryプラグインを検索します。

-また-

ユースケースに応じて、jQueryの代わりにCSS3アニメーションを使用します。

-また-

javascriptを使用して手動でアニメーション化します（定期的に背景位置を設定します。線形補間はそれほど難しくありません）

于 2012-10-30T15:43:17.497 に答える