Skip to main content
2 of 3
added 2 characters in body
Tamras Merin
  • 771
  • 13
  • 32

Change background image dynamically in IE

I'm trying to get the a page to display a background image based on Holiday.

When I used the DevTools in IE and pasted the following in #s4-workspace in css, nothing happened. But it worked when I pasted it under .ms-backgroundImage

background-image: url("bgimage.jpeg");

Below code works in Chrome and Edge but not in IE11.

if (dtTodayHol >= holSD && dtTodayHol <= holED) {
    document.getElementsByClassName('ms-backgroundImage')[0].style.backgroundImage = "url('" + holBG + "')";
}

Also tried it on #s4-workspace, same result:

    document.getElementById('s4-workspace').style.backgroundImage = "url('" + holBG + "')";

and also tried below but didn't work in Chrome, Edge, or IE:

.style.background = "#ffffff url('" + holBG + "') no-repeat cover"

All browsers are giving the same dates:

  • dtTodayHol = Tue May 21 2019 00:00:00 GMT-0700 (Pacific Daylight Time)
  • holSD = Mon May 20 2019 00:00:00 GMT-0700 (Pacific Daylight Time)
  • holED = Mon May 27 2019 00:00:00 GMT-0700 (Pacific Daylight Time)
Tamras Merin
  • 771
  • 13
  • 32