'How do I change the background url in javascript after using background-size: cover?

This is the CSS part (using background-size: cover):

#container>div {
  background: url("../static/opti2.jpg");
  background-size: cover;
  background-attachment: fixed;
  transition: all 0.5s ease-in;
}

What I want to do is change the URL background using Javascript.

javascriptcssbackgroundcoverphpwordpressmetadata


Solution 1:[1]

As mentioned in a comment above, use this code, replacing the URL with the new URL.

<script>

document.getElementById("container").style.backgroundImage = "url(..static/opti22.jpg)";

</script>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Matthew M.

Related Questions