Grow your CSS skills. Land your dream job.

Last updated on:

Change Graphics Based on Season

Function

<?php

function current_season() {
       // Locate the icons
       $icons = array(
               "spring" => "images/spring.png",
               "summer" => "images/summer.png",
               "autumn" => "images/autumn.png",
               "winter" => "images/winter.png"
       );

       // What is today's date - number
       $day = date("z");

       //  Days of spring
       $spring_starts = date("z", strtotime("March 21"));
       $spring_ends   = date("z", strtotime("June 20"));

       //  Days of summer
       $summer_starts = date("z", strtotime("June 21"));
       $summer_ends   = date("z", strtotime("September 22"));

       //  Days of autumn
       $autumn_starts = date("z", strtotime("September 23"));
       $autumn_ends   = date("z", strtotime("December 20"));

       //  If $day is between the days of spring, summer, autumn, and winter
       if( $day >= $spring_starts && $day <= $spring_ends ) :
               $season = "spring";
       elseif( $day >= $summer_starts && $day <= $summer_ends ) :
               $season = "summer";
       elseif( $day >= $autumn_starts && $day <= $autumn_ends ) :
               $season = "autumn";
       else :
               $season = "winter";
       endif;

       $image_path = $icons[$season];

       echo $image_path;
}

?>

Usage

<img src="<?php current_season() ?>" alt="" />

Comments

  1. In the days of Autumn, I accidentally put autumn starts on Sep. 22. That needs to be changed to Sep 23.

  2. In the interests of efficiency, it might be better to simply know what number day of the year each season starts on, then compare. So like:

    <php
    $day = date(“z”);
    if( $day < 79) $season = "winter";
    elseif( $day < 171) $season = "spring";
    elseif( $day < 265) $season = "summer";
    elseif( $day < 354) $season = "autumn";
    else $season = "winter";
    ?>

    • yep.. or:

      $today = getdate();
      $today = $today[‘mon’];
      if ($today>=1 && $today=3 && $today=6 && $today<=8) return 'summer';
      else return 'autumn';

    • omg.. sorry

      =1 && $today=3 && $today=6 && $today

  3. sean
    Permalink to comment#

    I’m having trouble with this script.

    I have created a PHP file, “current_season.php” in the same directory as my Web page.

    I have included in the Web page

    <?php include 'current_season.php'; ?&rt;

    I have included in the Web page

    <img src="<?php current_season() ?&rt;"&rt;<

    but it is not working.

    Any help, please?

    • sean
      Permalink to comment#

      Furthermore, even if I put the php scripting in the head of my Web page, it doesn’t work when I attempt to display the image.

      I’m wanting to put the php script in a .php file instead of on each individual page.

    • sean
      Permalink to comment#

      Furthermore, the files are named the same as in the script: “spring, summer, autumn, and winter,” and are in the “images” folder within the same directory.

  4. Permalink to comment#

    How can you alter this to do a time check, if AM, display AM image, if night, display a night image..

  5. Jacob
    Permalink to comment#

    Sean,

    In this section of code:

    <img src="” alt=”” />

    Make sure you have a “;” at the end of current_season().

    After correction:
    <img src="” alt=”” />

    Hope this helps, when I used it I was able to display the image just fine.

  6. Permalink to comment#

    Used this code to change page header 26 times per year. Discovered if you put a start date like December 21 and a stop date January 4 – to purpose being to cross over from the old year to the new year – since this code does not include the year – it screws the math up when it tries to count what day of the year it is…..

  7. Lorenzo

    Hello there i get a error in me firebug dialog:

    Failed to load given url when i hover the following line:

    <img src="” alt=”” />

    Already uploaded the images in the correct folder

    Anyone has a suggestion?

  8. I would love to accomplish the same script with a css file. How hard would that be?

    • Ruskyj
      Permalink to comment#

      JavaScript can help you with that ;)

      First, define a function (written by Juuitchan from http://www.webdeveloper.com/forum/showthread.php?t=125428 ):

      function dayofyear(d) {   // d is a Date object
      var yn = d.getFullYear();
      var mn = d.getMonth();
      var dn = d.getDate();
      var d1 = new Date(yn,0,1,12,0,0); // noon on Jan. 1
      var d2 = new Date(yn,mn,dn,12,0,0); // noon on input date
      var ddiff = Math.round((d2-d1)/864e5);
      return ddiff+1; }

      Then, compare it:

      var curdate=new Date(); // gets today's date
      var cdnum=dayofyear(curdate);
      
      if ( cdnum < 79) { season = "winter"; }
      else if ( cdnum < 171) { season = "spring"; }
      else if ( cdnum < 265) { season = "summer"; }
      else if ( cdnum < 354) { season = "autumn"; }
      else season = "winter";

      And with a simple help of jQuery (or you can use some different library), you can add the season class to the desired object:

      $(".myObject").addClass(season);
    • Philip Osborne
      Permalink to comment#

      You can use (almost) exactly the same PHP. Instead of paths to your image files, specify paths to your CSS files. You may want to change $image_path to $css_path just for the sake of clarity.

      Then in your HTML, instead of using

      <img src="<?php current_season() ?>" alt="" />

      in the <body> of your page, just use

      <link rel="stylesheet" href="<?php current_season() ?>" type="text/css" />

      in the <head> of your page.

      Just make sure that the PHP appears BEFORE the CSS link.

  9. Permalink to comment#

    If u provide demos regarding the articles posted.. it will be quiet useful..

  10. Marcus Duke
    Permalink to comment#

    Would love to figure out how to do this with not just an image, but an image rollover. Not sure your method is the way to go, however (because I don’t know enough about PHP).

  11. Billy
    Permalink to comment#

    Very good. Now how would one preload the images first since this is really useful to display some fantastic large size background image. many thanks.

  12. Philip Osborne
    Permalink to comment#

    Wondering if it’s possible to have hyperlinks that would force a particular season to give visitors the chance to preview the other seasons?

  13. Is there any way you can add the year to the php? I have a client that is using this for Holidays, since holidays change from year to year I just like to know if this is possible?

    • PD
      Permalink to comment#

      This works great for me…
      Zero at the end makes year goto any year. Do not have to update it.

      $holiDate10 = date(“Y-m-d”,strtotime(“Second Monday of October 0″)); // Columbus Day

Leave a Comment

Posting Code

Markdown is supported in the comment area, so you can write inline code in backticks like `this` or multiline blocks of code in in triple backtick fences like this:

```
<div>Example code</div>
```

You don't need to escape code in backticks, Markdown does that for you. If anything screws up, contact us and we can fix it up for you.

*May or may not contain any actual "CSS" or "Tricks".