PDA

View Full Version : Make a Table Fade


ACE35
08-01-2002, 04:45 PM
I was wondering if there was a script that made a table "fade" when the mouse isnt on it...and have it be "normal" when the mouse is on it...is there? thanks in advance!

boxer_1
08-01-2002, 05:15 PM
Here's a quick example I threw together using a script from Dynamic Drive (http://www.dynamicdrive.com/dynamicindex4/image5.htm). Of course it could be further modified and the other Image highlight scripts there could be modified to achieve the same effect with a table (essentially just CSS filters):

<html>
<head>
<title>Fading table example</title>
<script language="JavaScript1.2">
//Highlight image script- By Dynamic Drive
//For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
//This credit MUST stay intact for use

function makevisible(cur,which){
strength=(which==0)? 1 : 0.2

if (cur.style.MozOpacity)
cur.style.MozOpacity=strength
else if (cur.filters)
cur.filters.alpha.opacity=strength*100
}
</script>
</head>
<body>
<table width="80%">
<tr>
<td bgcolor="#c0c0c0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)">
Contents of table cell...
<br />
Some more test in the table cell...
</td>
</tr>
</table>
</body>
</html>

Copy/paste/save/preview the above to see what I mean. Does this give you the general idea?