Howdy, Stranger!
It looks like you're new here. If you want to get involved, click one of these buttons!
getElementByID("ID").style.backroundImage = url(img) doesnt show in browser
So, I wrote a short script, by which depending on the race the player chooses the backgroundimage is surposed to change:
which should change the background image from a div (map_1).
And it even outputs the correct filepath, and it works with normal html/css/js, but the browser doesn´t show any change in the div.
I dont want to change the class, because i would need about 20 different classes then.
Any suggestions?
(Using Sugarcube btw.)
<<script>>
document.getElementById("map_1").style.backgroundImage= "url(http://something.com/pics/race_"; + state.active.variables["race"] + ".png)";
console.log("Javascript sucess. map_1.style.backgroundImage = " + document.getElementById("map_1").style.backgroundImage);
<</script>>
which should change the background image from a div (map_1).
And it even outputs the correct filepath, and it works with normal html/css/js, but the browser doesn´t show any change in the div.
I dont want to change the class, because i would need about 20 different classes then.
Any suggestions?
(Using Sugarcube btw.)
Comments
You could also try the jQuery way which seems to be the most accepted way around here.
<<script>> $('#map_1).css("background-image", "url(http://something.com/pics/race_"; + state.active.variables["race"] + ".png)"); <</script>>I just saw that you said you don't want to change classes and want to confirm your div's ID is set to map_1, right? Not just it's class? I only ask because you're getting the element by its id which can make a world of difference.