Can't Set Background Image (No Errors In Console)

[Costanza]

What I want to do is click on an element and assign its background image to a specified div (so they have the same background). It's really simple stuff but it's not working even though the syntax looks perfectly correct to me. The function (currentCategory is a global variable which has been assigned a value by the time I click on the other div. That part is tested and working):

function equip(currentElement){document.getElementById(currentCategory).style.backgroundImage = currentElement.style.backgroundImage;}

The calling element in my html file:

<div class="stock itemContainer"><div id="skeleton_short" class="itemContent" onClick="equip(this)" onMouseOver="highlightItem(this)" onMouseOut="removeItemHighlight(this)"></div></div>

And the div which is to have its background changed (the inner div with id "stock"--but I am showing the parent div too in case it is helpful):

<div id="stockContainer" class="equipItemContainer"><div id="stock" class="itemContent" onClick="displayOptions(this.id)" onMouseOver="highlightItem(this)" onMouseOut="removeItemHighlight(this)"></div></div>

I checked it out using Chrome, but the console never returned any errors. Thanks again for your help, guys. I really try to exhaust all possibilities and try various solutions before posting a topic, but sometimes I just get stumped.

[Don E]

Did you check to see if 'currentCategory' is being assigned the proper value? It should be the id for the div you want to change the backgroundImage, which is 'stock'?

[Costanza]

Did you check to see if 'currentCategory' is being assigned the proper value? It should be the id for the div you want to change the backgroundImage, which is 'stock'?

In error console when I tell it to show me currentCategory, it says" stock" like it should, but underneath that it says "undefined".

[Don E]

That maybe the problem; it being undefined. Make sure you're getting 'stock' assigned to it. Make sure currentCategory is initialized with var in front of it, and is actually global. Where ever you're assigning 'stock' to it though, like inside a function, make sure you don't have var in front of currentCategory. Just something to check.

[Costanza]

That maybe the problem; it being undefined. Make sure you're getting 'stock' assigned to it. Make sure currentCategory is initialized with var in front of it, and is actually global. Where ever you're assigning 'stock' to it though, like inside a function, make sure you don't have var in front of currentCategory. Just something to check.

Thanks, yeah it's definitely global. At the beginning of my javascript document it right there:

var currentCategory = 'none';

Then when I click my category button, it assigns currentCategory the value "stock" which I confirmed is working by using the console to return its value after the issue occurs. (the issue being that it simply fails to do the background image assignment) I've checked everything in my code related to the id "stock". It is in my CSS file and everything checks out (it's only 1 line, which assigns the background image); The id is spelled correctly in the div itself... I just don't know what the issue could be. What does "undefined" really mean in this case since it was referring to the id "stock"? (at least i assume that's what it meant--I don't really understand how to use the console to debug very well)

[dsonesuk]

If the styling is set inline within the actual element, then javascript would find the background image, else if set by css in head or external stylesheet then you would have to use currentStyle or getComputedStyle depending if IE or not! to retrieve background-image css link

function equip(currentElement){if(window.getComputedStyle)	{	document.getElementById(currentCategory).style.backgroundImage = getComputedStyle(currentElement).getPropertyValue("background-Image")	 }else	{	document.getElementById(currentCategory).style.backgroundImage = currentElement.currentStyle.backgroundImage;	}}

[Costanza]

Thank you dsonesuk! That works perfectly. I didn't even know about currentStyle and getComputedStyle. Something I've got to look more into to understand more thoroughly. Thanks again! This was the final part of my code that I needed to move onto the next major part of this little application.

[ShadowMage]

I didn't even know about currentStyle and getComputedStyle. Something I've got to look more into to understand more thoroughly.

In case you'd like to read up more on element styles:http://www.sophox.com/wordpress/?p=882