Highlight Table Row script using CSS

[janjan32]

I am using your wonderful script, and I love it!
but.... I would like to know if I can change the color using css or in my global js file. I tried but so far have not had any luck.
http://www.dynamicdrive.com/dynamici...lighttable.htm

<table onMouseover="changeto(event, 'ffcc64')" onMouseout="changeback(event, 'white')">

Thanks for any advise!
Jan

[gingerj]

try this:

onmouseover="style.backgroundColor='#333333'; style.cursor='hand'; style.border='1 solid #CCCCCC'" onmouseout="style.backgroundColor='#000000'; style.border='1 solid black';"

[mwinter]

=gingerj]try this:

No, don't.

onmouseover="style.backgroundColor='#333333';

What style variable would that be referring to, then? Relying on the browser to randomly augment the scope chain is a bad idea. Use the this operator to refer to the element:

this.style.backgroundColor = '...';

style.cursor='hand';

There is no 'hand' value for cursors. You mean pointer.

style.border='1 solid #CCCCCC'"

A border width of 1 what? Miles? Sheep? All non-zero length values must be followed by a unit.


As for the original question, the script doesn't consider a style sheet, so that option isn't possible (without a complete rewrite). You could define a global variable containing the colour value, and then reference that when calling the functions:

var highlightColour = '#ffcc64',
    normalColour = '#ffffff';

then:

<table onMouseover="changeto(event, highlightColour);" onMouseout="changeback(event, normalColour);">

Mike