Home > other >  Javascript- How do I change the background-image property in css?
Javascript- How do I change the background-image property in css?

Time:05-19

With Javascript, I am trying to change the background-image on my web app.

Here is how Im trying to do it:

const bgimg = {
   backgroundImage: "URL('../../Images/arches.JPG')"
    }
<div style={bgimg} id="bg_img">

This method works fine when I use a pic from the internet with it's url, but it wont let me add a local image. I can use the same pictures on my computer if I implement it right in css, like

.container_image {
  background-image: url(./Images/yellow_stone_copy.JPG)
}

But I want to be able to change the background, while it's running, to an image on my computer. What am I doing wrong?

CodePudding user response:

Make sure the url of the image you want to use is relative to the html file and not to the js file

  • Related