CODEWITHSUNDEEP
javascripthtml
jmfer1
jmfer1

Reputation: 11

Website changes according to hours of the day

Is there a way of having a website that changes with the hours of the day? Example: Let's say we have 3 images (image1.png, image2.png and image3.png). Each image represents a show of a TV Station. What I would like is to setup a webpage that displays the images in this way:

• From 7am to 10 am - Show "image1.png"
• From 10:01 am to 2pm - Show "image2.png"
• From 2:01pm to 8pm - Show "image3.png"

Upvotes: 0

Views: 1265

Answers (3)

Low-Pointer
Low-Pointer

Reputation: 163

It is a server side scenario. You have tagged the question with 'javascript', which is a client side script. It will always return the time on "User's PC". The facility you are trying to embed should be implemented in your server side script. Which script are you using PHP/ASP ?

<?php 

switch (TRUE){ 
$hour = date('H');
case ($hour 7 > 10): 
$show = '<img src="/images/image1.gif">'; 
break; 

default: 
$show = '<img src="/images/image2.gif">'; 
break; 
} 

echo "$show"; 
?>

You can add more 'cases' as per your need.

Upvotes: 0

Nickersoft
Nickersoft

Reputation: 684

Easily achievable in Javascript (or PHP if you know it). Let's take for example JavaScript, however:

document.body.onload = function()
{
     var rightNow = new Date();
     var hour = rightNow.getHours();
     var img = document.getElementById("myimageid");
     if(7<hour<9) //If it's between 7 AM and 9:59 AM
     {
         img.src = "image1.png";
     }
     else if(10<hour<13) //If it's between 10 AM and 1:59 PM
     {
         img.src = "image2.png";
     }
     else if(14<hour<19) //If it's between 2 PM and 7:59 PM
     {
         img.src = "image3.png";
     }
}

Haven't tested this, but it should work.

Upvotes: 1

Mark S
Mark S

Reputation: 869

    var dt = new Date();
    var h = dt.getHours() + 1;
    if (h >=7 && h < 10) {
        //set bg 1
    } else if (h >= 10 && h < 2) {
        //set bg 2
    } else if (h >= 2 && h < 8) {
        //set bg 3
    } else {
        //set def bg
    }

Upvotes: 0

Related Questions