Invalid character error?

Hello,

I'm getting an invalid character error from using this mouse over script on my table.


<tr bgcolor='<%=bgcolor%>' style="cursor: pointer" onMouseOver="this.bgColor='#C0C0C0'"; onMouseOut="this.bgColor='<%=bgcolor%>'"; onclick="javascript: window.location.href='?step=5&formtype=<%=rs("FormType")%>&orderid=<%=rs("oid")%>'";>
<td class='steps' onmouseover='this.backgroundcolor=#C0C0C0'><%=JobID%></td>
<td class='steps' onmouseover='this.backgroundcolor=#C0C0C0'><%=rs("Nickname")%></td>
<td class='steps' onmouseover='this.backgroundcolor=#C0C0C0'><%=rs("username")%></td>
<td class='steps' onmouseover='this.backgroundcolor=#C0C0C0'><%=FormTypes(rs("FormType"))%></td>
<td class='steps' onmouseover='this.backgroundcolor=#C0C0C0'><%=rs("InvDate")%></td>
</tr>


does anyone see anything wrong with this code?

thanks in advance for your time!
-SiX

yes, setting the backgroundColor should be a string value:
this.backgroundcolor="#C0C0C0"
and it should probably be:
this.style.backgroundColor = "#C0C0C0"
you can use either ' or " to surround the value, but they must be present, or javascript thinks you are using a variable.

ah yes, that was it.

thanks!
-SiX

All the compound words attributes have to use first letter in uppercase for each second/next word whenever "translate" from CSS to javascript "on-the-fly" (javascript DOM methods to create/change CSS attributes/values)

CSS background-color becomes on-the-fly backgroundColor
CSS font-weight becomes on-the-fly fontWeight
and so on

I would note also that this "uppercased isssue" should work the same (at least for IE) even for the HTML compound attributes, when they are to be handled with DOM methods

object.setAttribute('bgColor','somevalue')
object.setAttribute('colSpan','somevalue')
and so on

There is a lot to say about how adequate are all these, but, as far as I have seen... this is it, at least till now. :)

On the other hand, same as some others CSS attributes (for instance border) , "on-the-fly" background related attributes can be written in a shorthand, I mean it is enought to use

in CSS
background:#cccccc

in javascript
object.style.background='#cccccc'

On the other hand, same as some others CSS attributes (for instance border) , "on-the-fly" background related attributes can be written in a shorthand, I mean it is enought to use

in CSS
background:#cccccc

in javascript
object.style.background='#cccccc'


That's not necessarily true when it comes to setting it to null. For example, say I have a table with tr elements colored blue. I set a few td elements to change their background colors to red onmouseover. Prior to the javascript adding the background the td had no background color declaration. If I set it back like this:


td.style.background='';


The whole cell will turn white, and the tr color will not shine through. If you add the "Color" it will be as it was before.

See:

Good -
http://www.collateralservice.com/highlighter.html

Bad -
http://www.collateralservice.com/highlighterbad.html


It reacts a bit differently in both Moz and IE.

Basscyst