0

私は自分のサイトで背景画像をアニメーション化しようとしています。背景画像を選択すると、左からスライドして古い背景を画像から押し出します。私が書いたものが機能しないため、誰かがコードを手伝ってくれますか？ 、

    <script type="text/javascript">
$("a.background_btn").click(function(ev){
    ev.preventDefault();
//  alert("hello");
    var url = $(this).attr("href");
//  alert(url);
    $.ajax ({
        url : url, 
        type: "POST",
        success : function (data) {
            $('#wrapper').css('background', 'url(/media/uploads/backgrounds/'+(data)+')');
            $('#wrapper').css('background-position', '-1000px 0px');
            $('#wrapper').css('background-repeat', 'no-repeat');
            $('#wrapper').animate({backgroundPosition: '0px 0px'}) 
        }
    })
});
4

3 に答える 3

1

追加のメモに基づいて、コンテナーは一度に 1 つの背景しか持てないため、jquery で背景を設定すると、古い背景も削除されます。

必要な効果を得るには、追加の要素を #wrapper の「横」に挿入してスライドさせるか、背景をスプライト画像としてつなぎ合わせてから、必要に応じて単一の背景をスライドさせる必要があります。

つまり、新しい背景で古い背景を文字通り「押し出す」ようにしたい場合です。古い背景が完全に終了してから新しい背景が入ることに問題がない場合は、ブランドンのポイントが最も簡単かもしれません.

于 2010-01-11T15:04:18.707 に答える
0

それについて何がうまくいかないのですか？何もしないだけですか？その場合は、ハンドラーをアタッチしたコードを実行するのが早すぎた (DOM の準備が整う前) 可能性があります。次のように、そのイベントのハンドラーでコードをラップします。

$(document).ready( function() {
  .. your code here ...
} );
于 2010-01-11T14:51:46.543 に答える
0

この行で背景を変更する前に

$('#wrapper').css('background', 'url(/media/uploads/backgrounds/'+(data)+')');

元の背景を希望する方向にアニメーション化します。

于 2010-01-11T15:01:49.683 に答える