デザイン

背景画像をランダムに

投稿日:

今までずっとTOPの背景画像(マックさんの写真の所)が一枚で固定されてたんですけど、phpでランダムに変わるようにしてみました。

と言ってもまだ3枚しか用意してないので、あまり変わらないかも(笑

■やり方

rotate.phpというのを使いました。
ダウンロードはこちら

1. ダウンロードしたrotate.txtの拡張子txtをphpに変更。

2. rotate.phpの初期設定をするのですが、画像とrotate.phpを同じフォルダに入れる時は設定はデフォルトのままでOKです。
画像とrotate.phpをアップロードしちゃいましょう。

画像とrotate.phpを別々の場所に置きたい場合はエディタでrotate.phpを開き、107行目の

$folder = ‘ . ‘;

のところに画像を入れるフォルダをフルパスで書きます。

例:

$folder = ‘/home/www/*****/images/bg/’;

3. CSSで指定した背景画像をrotate.phpに指定。

例:

background-image: url(https://kumaho.info/******/bg/rotate.php);

4. ファイルをアップロード。
【rotate.phpと画像の場所が違う場合】
2で指定したフォルダに画像を、CSSで指定したフォルダにrotate.phpをアップロード。

【rotate.phpと画像の場所が同じ場合】
CSSで指定した画像フォルダにrotate.phpと画像を一緒にアップロード。

これでランダムに表示されます。
3枚しかうpしてないけどリロードすると変わるはずです。

関係ないですけど、今日からMac IE(5.x)にはスタイルシートを適用しないことにしました。
古いブラウザ対策は、他のサイト制作ではこれからもある程度やっていかなきゃいけないでしょうが、ウチでは対象外にしました。

-デザイン
-,


  1. きゃお より:

    あー、そういうことだったのね。
    今朝見たら波打ち際の写真になってたから、「かわいいマックさん、もう見れないの?(´;ω;`)」と思ってたの。

    ランダムなら楽しみだな♪
    いろいろな写真用意して楽しませてね!
    沖縄とか、犬猫とか、玉とか☆

  2. ニコ より:

    >きゃおちん

    まだ3枚なんで、ランダムっても同じのばっか出てくるけど(笑

    そうだねぇ、沖縄の海とか、犬猫とか。。。
    た、玉は無理じゃ(´Д`;)

ニコ へ返信する コメントをキャンセル

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

IE7で消えるパンくず

さて、最近はプライベートな日記はmixiのほうに書いております。 こちらは犬関係か仕事関係の覚え書き …

スルスルスクロール

jQueryでページ内リンクをスムーズにスクロールさせてみました。 「このページのトップへ」みたいな …

Nucleus

今日はNucleusをインストールしてみました。 最初、インストール画面で真っ白になったけどhtac …

また朝だ。

こないだ、Mac IEで表示が崩れるとか、いろいろ書きましたけど。 実は先日作ったサイト、XHTML …

Meteor Slidesのボタンをセンタリングする

WordPressプラグイン「Meteor Slides」を導入してスライドショーにしてみたわけです …

カテゴリー

アーカイブ

サイト内検索