Question

I am trying to change the back ground image url’s based on the time of the day. Like in the morning AM time sun rising ….sun set. Each has its own png file and a url. I am creating the site in ruby on rails and using sass-rails for css.

So my question, is there a smart way to change the bg image url of css class reading from a helper method or something?

Or use Jquery to call a server side method and return the image url?

Any help is much appreciated.

Answer 1

try this way

<script type="text/javascript">

var currentTime = new Date().getHours();
if ( currentTime> 6 | currentTime<9) {
if(document.body) {
document.body.background = "sunrise.jpg";
}
}
else if (currentTime>=9 &&currentTime < 20) {
if(document.body) {
document.body.background = "daytime.jpg";
}
}
else if (currentTime>20 &&currentTime < 24) {
if(document.body) {
document.body.background = "sunset.jpg";
}
}
else {
if (document.body) {
document.body.background = "nighttime.jpg";
}
}

</script> 

source : http://www.sitepoint.com/forums/showthread.php?744436-Changing-div-background-image-based-on-time