[websitepro]

Why cant I change the background image using this code? How should I be setting the background image property here?

I have td tags with the name HLC1. I cannot use getElementById for what my use is for this. I am updating an entire column with the same name. I can do this by accessing the class name like: nodes[i].className = "whateverclass", but I already have class names assigned and only need to change the background image.

  function HLC(HLCnum) { 
    var nodes = document.querySelectorAll('[name=HLC1]');  
            var len = nodes.length;
            for (i = 0; i < len; i++) {
                // DOESNT WORK >> nodes[i].style.setProperty("backgroundImage", "url('../../../layout_images/bg_50percent_white.png')")
                // DOESNT WORK >> nodes[i].style.backgroundImage = "url('../../../layout_images/bg_50percent_white.png')"
                // DOESNT WORK >> nodes[i].style({ backgroundImage: "url('../../../layout_images/bg_50percent_white.png')" })	
        }
    }

[Dormilich]

the name attribute on <td> is most probably ignored. only form control elements (<input>, etc) and <a> can have a name.

try alerting the length of nodes so you can see whether you have matches at all.

[websitepro]

Nevermind. I fixed it. This had to be the most rediculous thing I have seen in a while. For some reason the onmouseover/onmouseout that called the function had to be after the class="blah" in the td tag. What F'n sense does that make?? No browsers would work without that fix either. Such a waste of time. Sometimes I dont understand simple things that break code. This should not have been an issue. oh well, maybe this will save someone some time.

[websitepro]

Dormilich, on 27 January 2012 - 12:57 PM, said:

the name attribute on <td> is most probably ignored. only form control elements (<input>, etc) and <a> can have a name.

try alerting the length of nodes so you can see whether you have matches at all.

Thanks for your response, however you can name td tags and it will work fine in any modern browser. I've been doing this same thing for a while with changing className. I should have made sure the onmouseover was being called like you said with an alert, before going crazy over the js.

[Dormilich]

websitepro, on 27 January 2012 - 08:59 PM, said:

For some reason the onmouseover/onmouseout that called the function had to be after the class="blah" in the td tag.

one more reason to not use inline-JS. wouldn’t have happened if you defined the event from within Javascript.

[websitepro]

What is inline about the call? for testing I hard coded the td name. Serious question. If you know somethiing I dont, please elaborate.

<td name="HLC1" onmouseover=""HLC(1);"">asdf</td>

duh. nevermind. Im with you.. You mean actually defining the onmouseover event itself. You are correct and I may end up converting the code.