web-dev-qa-db-ja.com

N分/秒ごとのヘッダー画像の変更

"n"秒/分ごとにヘッダー画像を変更しようとしています。 Web上のいくつかの解決策を見て、現在 http://ma.tt/scripts/randomimage/ で入手可能な下記のPHP codeフラグメントを使用しています。 :

それはまだ 'n'分ごとではなくページリロードの画像を変更するだけです。私はまたポストで記事を見ました:

1日にヘッダ画像を回転させるにはどうすればいいですか?

しかし、私はそれが私が欲しいものをするためにどのように適応するかを知りません。

私はPHPに非常に慣れていないので、どうすればよいのかについて私にいくつかの指針を貸してください。

また、これはPHPのJavaScriptでもっとうまくいくでしょうか。

前もって感謝します。

1
navanitachora

あなたの質問に答えるには、私の意見ではJavaScriptを使うほうがずっとよいでしょう。 jQueryはこれを行うための優れたツールです。あなたのテーマに jQuery Cycle Plugin。 をインストールすることをお勧めします。 PHPを使用してイメージをテーマにロードすることもできますが、ページをリロードすることなくイメージを変更する場合は、JavaScriptを使用するのが最善です。

このようなもの:あなたのfunctions.phpにこのコードを追加してjQueryとjQuery Cycleを追加します

    <?php
function my_scripts_method() {
    wp_enqueue_script('jquery');
    wp_register_script( 'jcycle', 'http://ajax.aspnetcdn.com/ajax/jquery.cycle/2.99/jquery.cycle.all.min.js'); //register the Microsoft cdn copy of jcycle this could also be your local copy
    wp_enqueue_script('jcycle');
  }    

add_action('wp_enqueue_scripts', 'my_scripts_method'); //
?>

wp enqueue script および jCycle用のMicrosoft CDN を参照してください。

それからheader.phpにこれを追加してください。

<head>
<script type="text/javascript">
jQuery(document).ready(function($) {
    $('#header').cycle({
        fx: 'fade', //your effect
                random: 1, //make it random
                timeout: 5000 // change header every 5 seconds

    });
});
</script>
</head>
<body>
    <div id="Header">
        <img src="beach1.jpg" width="200" height="200" />
        <img src="beach2.jpg" width="200" height="200" />
        <img src="beach3.jpg" width="200" height="200" />
    </div>
</body>

他にもjQuery/JavaScriptスライドショー/サイクルプラグインがありますが、これはあなたを正しい方向に導いてくれると思います

0
Brooke.