Js Style Change

Peter

Member
Nice, little website you've created. Only thing that worries me is that people might be confused, thinking they have arrived at another website, if the theme automatically change like that. Do you have any plans for using this technique on bigger websites?

I couldn't resist looking at the code and I noticed this block ...
Code:
if (hour >= 18) {
    $(".change").css("background-color", "#003366");
    $(".change_2").css("background-color", "#00416A");
    $(".space").css("background-color", "#003399");
    $(".picture").css("background", "url(http://cdn.wallpapersafari.com/29/15/HLCVij.jpg) no-repeat center center scroll");
    $(".picture-2").css("background", "url(http://scienceblogs.com/startswithabang/files/2013/04/night-sky-stars.jpeg) no-repeat center center scroll");
    $(".lighten").css("color", "#FFFFFF");
    $("#night").html("Night");
    $(".footer-link").css("color", "#00FF00");
} else if (hour <= 5) {
    $(".change").css("background-color", "#003366");
    $(".change_2").css("background-color", "#00416A");
    $(".space").css("background-color", "#003399");
    $(".picture").css("background", "url(http://cdn.wallpapersafari.com/29/15/HLCVij.jpg) no-repeat center center scroll");
    $(".picture-2").css("background", "url(http://scienceblogs.com/startswithabang/files/2013/04/night-sky-stars.jpeg) no-repeat center center scroll");
    $(".lighten").css("color", "#FFFFFF");
    $("#night").html("Night");
    $(".footer-link").css("color", "#00FF00");
}
else {
    return;
}
... could be reduced to ...
Code:
if (hour <= 5 || hour >= 18) {
   Night();
}
 

Barnum4000

Moderator
Peter said:
Nice, little website you've created. Only thing that worries me is that people might be confused, thinking they have arrived at another website, if the theme automatically change like that. Do you have any plans for using this technique on bigger websites?

I couldn't resist looking at the code and I noticed this block ...

the only big plans I would have is to use it to improve the accessibility for a site. I mainly made it for a bit of fun and something to possibly show on my CV or portfolio.

I appreciate the help with the code I'm still a bit of a nooby with Js and don't know all the best methods for achieving a goal.