Jürgen
Jürgen

Reputation: 27

Javascript backgroundImage url css change

I need to change the backgroundImage of a div in a parent iframe.

I can do it, but not in a useful way, I need to send the variable from the button.

At the moment I have the variable in the script.

<script>
function myFunction() {
window.parent.document.getElementById('seekerBase').style.backgroundImage = "url('http://www.floom.com/images/waveform_lotos.gif')";
 }
</script>

<button type="button" onclick="myFunction()">Get the background image of div</button>

I need to send the image url from the button and not having it in the script.

I tried this and is not working.

<script>
    function myFunction() {
    window.parent.document.getElementById('seekerBase').style.backgroundImage = "url()";
     }
    </script>

    <button type="button" onclick="myFunction('http://www.floom.com/images/waveform_lotos.gif')">Get the background image of div</button>

Thanks for your help. I am a newbie.

Upvotes: 0

Views: 63

Answers (1)

krishnaxv
krishnaxv

Reputation: 956

Background image URL, http://www.floom.com/images/waveform_lotos.gif , passed to myFunction(bgImgUrl) is basically a parameter to the function. For more information on JavaScript Functions, refer Mozilla/Functions

Try this!

<script>
  function myFunction(bgImgUrl) {
    window.parent.document.getElementById('seekerBase').style.backgroundImage = 'url(' + bgImgUrl + ')';
  }
</script>

<button type="button" onclick="myFunction('http://www.floom.com/images/waveform_lotos.gif')">Get the background image of div</button>

Hope it helps!

Upvotes: 4

Related Questions