Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Westi on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Hover using either CSS or <style> tag

Status
Not open for further replies.
Gill1978

Gill1978

Programmer
Jun 12, 2001
277
GB
Hi!

I have a table that is generated through a class. However how do i get each line (i.e. <td>) to be highlighted when the mouse is moved over it. I have tried setting each line as a HREF but it only highlights the words on each column i'd like the whole line to be highlighted if the user hovers over any part of the line (<TD>).

Can anyone help?

Thanks

Julie
 
Sort by date Sort by votes
try this...
Code: 
<SCRIPT LANGUAGE=&quot;JAVASCRIPT&quot;>
function back(id, colour)
{
if(document.all)
  var prefix=document.all[id].style;
else
  var prefix=document.layers[id];
	
prefix.background=colour; 
}
</SCRIPT>

<TABLE>
<A HREF=&quot;page1.asp&quot; onMouseOver=&quot;back('row1','#FF0000');&quot; onMouseOut=&quot;back('row1','#FFFFFF');&quot;><TR ID=row1><TD><SPAN>row 1 link</SPAN></TD></TR></A>
<A HREF=&quot;page2.asp&quot; onMouseOver=&quot;back('row2','#FF0000');&quot; onMouseOut=&quot;back('row2','#FFFFFF');&quot;><TR ID=row2><TD><SPAN>row 2 link</SPAN></TD></TR></A>
</TABLE>
Tony
reddot.gif WIDTH=400 HEIGHT=2 VSPACE=3

 
Upvote 0 Downvote
This block works for an IE only targetted platform. Still doesn't solve a problem whereby if the stylesheet colours are changed the javascript colours still need updating.

Not figured out how to get the javascript to get it's colours from a stylesheet yet.

<HTML>
<HEAD>
<STYLE>
.TR1 {
COLOR: black;
BACKGROUND-COLOR: #eceeeb
}
.TR2 {
COLOR: black;
BACKGROUND-COLOR: gainsboro
}
</STYLE>
<SCRIPT LANGUAGE=&quot;JAVASCRIPT&quot;>
function SelectionHoverOver(tag) {
var t = tag.style;
t.cursor='hand';
t.background='dimgray';
t.color='#eceeeb';
}
function SelectionHoverOut(tag, hoverType) {
var t = tag.style;
t.cursor='';
t.color='black';
if (hoverType==1)
t.background='#eceeeb';
else
t.background='gainsboro';
}
</SCRIPT>
</HEAD>
<BODY>
<TABLE cellspacing=0 callpadding=0 border=0>
<TR CLASS=TR1 onMouseOver=&quot;SelectionHoverOver(this);&quot; onMouseOut=&quot;SelectionHoverOut(this,1);&quot;>
<TD>Row 1 Col 1</TD>
<TD>Row 1 Col 2</TD>
</TD></TR>
<TR CLASS=TR2 onMouseOver=&quot;SelectionHoverOver(this);&quot; onMouseOut=&quot;SelectionHoverOut(this,2);&quot;>
<TD>Row 2 Col 1</TD>
<TD>Row 2 Col 2</TD>
</TD></TR>
</TABLE>
</BODY>
</HTML>
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

leifoet
  • Locked
  • Question
Using date picker gives an error message, only at application start
Replies
1
Views
430
MarkSweetland
MarkSweetland
Papa Bear
  • Locked
  • Question
Sending emails using CDOSYS
Replies
0
Views
171
Papa Bear
Papa Bear
leifoet
  • Locked
  • Question
Form Method=Post =&gt; how to process options ?
Replies
0
Views
145
leifoet
leifoet
krabban
  • Locked
  • Question
Using application(&quot;something&quot;) along with regular expressions
Replies
0
Views
152
krabban
krabban
chikwendu
  • Locked
  • Question
OraOLEDB error '80040e4b'
Replies
1
Views
614
xwb
xwb

Part and Inventory Search

Sponsor

Back
Top