[PHP]PHP で時間帯によってCSS の背景画像を切り替える方法｜PHP｜WEBデザインの小ネタとTIPSのまとめサイト「ウェブアンテナ」

[PHP]PHP で時間帯によってCSS の背景画像を切り替える方法

スポンサード

ウェブサイトやブログを問わず、例えば「昼は青色の背景」「夜はグレーの背景」など、時間帯によってCSS の背景画像を変更したい場合に便利なカスタマイズです。

昼、夜以外にも時間帯を細かく区切ることも出来るのですが、今回は6時～18時の時間帯はA.css、それ以外の時間帯はB.css を読み込む処理をご紹介します。

時間帯によって出力するCSS を変更する

day.css には昼用の背景画像、night.css には夜用の背景画像をそれぞれ記述しておき、6時～18時の時間帯をday.css 、18時～6時までの間はnight.css を読み込むようにします。

<?php
$time = intval(date('H'));
if (6 <= $time && $time <= 17) { ?>
    <link rel="stylesheet" href="./day.css">
<?php } else { ?>
    <link rel="stylesheet" href="./night.css">
<?php } ?>

<?php

$time = intval(date('H'));

if (6 <= $time && $time <= 17) { ?>

<?php } else { ?>

<?php } ?>

上記コードの3 〜4 行目が6～18時の時間帯、5 〜6 行目がそれ以外（18〜6時）の時間帯の出力処理です。

参考ページ
phpで時間帯によって表示内容を変更する

タイムゾーンの設定

しかし上記コードだけだと、環境によっては指定した時間帯になっても背景画像が変わらない場合もあるので、タイムゾーンを設定することで回避します。

<?php
date_default_timezone_set('Asia/Tokyo');
$time = intval(date('H'));
if (6 <= $time && $time <= 17) { ?>
    <link rel="stylesheet" href="./day.css">
<?php } else { ?>
    <link rel="stylesheet" href="./night.css">
<?php } ?>