1

基本的に、私が持っているのは 4 つほどの .php ページで、それぞれ #container div が異なる色に設定されています。ナビゲーションの各リンクをクリックして新しいページが読み込まれると、以前の色から背景をフェード インさせたいと考えています。例えば。背景が青色で、新しいページがクリックされ、青色から赤色にフェードアウトします。色の良い選択ではありませんが、私はちょうどテストしています.

これまでのところ、以下のようなものがありますが、背景色はフェードしますが、前の色が何であったかがわからないため、白からフェードインします。jQuery 1.4 と jQuery カラー プラグインを使用して、フェードインをアニメーション化しています。

$(document).ready(function() {  
    $("body.pageOne #container").animate( { backgroundColor: 'blue' }, 2000).delay(5000);  
    $("body.pageTwo #container").animate( { backgroundColor: 'red' }, 2000).delay(5000);  
});

ご協力いただきありがとうございます！

4

2 に答える 2

0

前の色を「引き渡す」唯一の方法は、色をGETパラメーターとして送信することです (リンクの URL に追加し、もちろんバックエンドの JS に何らかの方法で挿入します)。 AJAX 経由でページをロードしますが、これはおそらく良い方法ではありません。

アップデート：

これGETは、URL にパラメーターを追加することを意味します。たとえば、ナビゲーションが次のようになっている場合:

<ul>
  <li><a href="/page1">Page 1</a></li>
  <li><a href="/page2">Page 2</a></li>
</ul>

次に、ページの色を URL に追加します。

<ul>
  <li><a href="/page1?color=AAAAAA">Page 1</a></li>
  <li><a href="/page2?color=BBBBBB">Page 2</a></li>
</ul>

次に、サーバー側でcolor値を読み取って使用できます。たとえば、PHP を使用している場合 (もちろん、エラー処理を行いcolor 、有効な値が含まれていることを確認する必要がある場合):

<div id="container" style="background-color:#<?php GET['color'] ?>" ></div>
于 2010-02-20T23:30:04.730 に答える
0

sessionsを使用している場合は、色を $_SESSION 変数に入れることもできます。この変数は、アニメーションが完了したら AJAX 経由で更新します。次に、PHP 側でインライン スタイルを使用して「元の」背景色を設定できます。

J:

$(document).ready(function() {  
    $("body.pageOne #container").animate({backgroundColor: 'blue'},2000,function(){
        bgColor = 'blue';
      }).delay(5000);  
    $("body.pageTwo #container").animate({backgroundColor: 'red'},2000,function(){
        bgColor = 'red';
      })).delay(5000);

    $.post('example.php', {backgroud_color: bgColor}, function(data){
        //may want a return function to check for errors...?
    });   
});

PHP:

$_SESSION['background_color'] = $_POST['background_color'];

出力：

$bg = isset($_SESSION['background_color']) ? $_SESSION['background_color'] : 'white';
echo '<div id="container" style="background-color:'.$bg.';">
      </div>';

@Felix の回答と比べると少し手間がかかりますが、URL に値を入力する必要はありません。

于 2010-02-20T23:32:56.347 に答える