javascript - Changing a background image of <body> (in CSS) depending on the season (Current Calendar Month) -

-

i'd change html background depending on date, i've written isn't working properly. can't find applicable examples , i'm struggling complete it.

i want start of new season change background of html page altering image used in css file.

javascript:

var d = new date(); var day = d.getdate(); var month = d.getmonth(); if (month == <3 && month == 5) {     document.background-image: url("springtree.jpg"); } else if (month == < 6 && month == > 8) {     document.background-image: url("summertree.jpg"); } else if (month == < 9 && month == > 11) {     document.background-image: url("autumntree.jpg"); } else (month == 12 && month == > 2) {     document.background-image: url("wintertree.jpg");

css:

div.body {   background-image: url("summertree.jpg");     width: 640px;     height: 1136px;     background-repeat: no-repeat;     background-attachment: fixed;     background-position: center;     background-size: cover; }

i'm not sure if accomplished jquery i'm willing experiment anything.

as can see have no clue i'm doing , i'm in need of help, thanks.

i suggest use class injection <html> tag. javascript code inject whatever class want (depending on location (winter vs summer) or local time (day vs night)). , css have backgrounds (or other differences accordingly.

css:

.spring {background-image: url("springtree.jpg");} .summer {background-image: url("summertree.jpg");} ...

you can have other differences:

.spring li {color: green} .winter li {color: white}

you can set class javascript this:

var html = document.getelementsbytagname('html')[0]; html.setattribute('class', 'spring');

or if want multiple classes inject (add) 1 need:

root.classlist.add('evening');

with conditions:

var d = new date(); var month = d.getmonth() + 1; var html = document.getelementsbytagname('html')[0]; if (month >= 3 && month <= 5) {     root.classlist.add('spring'); } else if (month >= 6 && month <= 8) {     root.classlist.add('summer'); } else if (month >= 9 && month <= 11) {     root.classlist.add('autumn'); } else(month == 12 || month <= 2) {     root.classlist.add('winter'); }

Comments

Post a Comment

Popular posts from this blog

Hatching array of circles in AutoCAD using c# -

-
i beginner in autocad plugins .i have created array of circle using following code. now, have hatch circles in array .how that??how hatch circles @ once? moreover, how can return hatch method , use hatch objects.sorry language.thanks in advance. [assembly: commandclass(typeof(beamsection.class1))] namespace beamsection { public class class1 { //class1 obj = new class1(); [commandmethod("beamatsupport")] public void addlightweightpolyline() { // current document , database document acdoc = application.documentmanager.mdiactivedocument; database accurdb = acdoc.database; promptpointresult ppr = acdoc.editor.getpoint("\nselect starting point "); var ucs = acdoc.editor.currentusercoordinatesystem; point3d startingpt = ppr.value.transformby(ucs); list<double> radius = new list<double>(); radius.add(0.5); ...
Read more

ios - UITEXTFIELD InputView Uipicker not working in swift -

-
hello trying pop uipickerview view programmatically when user clicks on textfield. have tried doesn't doing anything. isn't working. nothing happening when click textfield class userprofiletableviewcontroller: uitableviewcontroller,uitextfielddelegate,uipickerviewdelegate,uipickerviewdatasource { var itempicker: uipickerview! = uipickerview() @iboutlet weak var gendertxtfield: uitextfield! var gender = ["male","female"] override func viewdidload() { super.viewdidload() gendertxtfield.delegate = self itempicker!.delegate = self itempicker!.datasource = self itempicker!.backgroundcolor = uicolor.blackcolor() self.gendertxtfield.inputview = itempicker } func numberofcomponentsinpickerview(pickerview: uipickerview) -> int{ return 1 } // returns # of rows in each component.. func pickerview(pickerview: uipickerview, numberofrowsincomponent component:...
Read more