Tekst og link fader problemer
Jeg har nogle problemer med dette script:I firefox virker min mouseover og mouseout kun første gang.. :-(
Og i IE virker fadningen slet ikke... :-((
-------------------------------------------------
<html>
<head>
<title>Fade ind og ud</title>
<script type="text/javascript">
opac = 0;
function fadeind(id)
{
if (opac <= 80)
{
if(document.getElementById("mintxt"+id))
{
obj = document.getElementById("mintxt"+id);
if (document.all)
{
obj.filters.alpha.opacity = opac;
}
else
{
obj.style.MozOpacity = opac / 100;
}
opac += 5;
setTimeout("fadeind("+id+");", 20);
}
}
else
{
id += 1;
opac = 0;
setTimeout("fadeind("+id+");", 10);
}
}
op = 80;
function over(id) {
if (op >= 40)
{
if (document.all)
{
for(x=0;x<5;x++)
{
if(x != id)
{
obj.filters.alpha.opacity = opl;
}
else
{
obj.filters.alpha.opacity = 100;
}
}
}
else
{
for(x=0;x<5;x++)
{
if(x != id)
{
document.getElementById("mintxt"+x).style.MozOpacity = op / 100;
}
else
{
document.getElementById("mintxt"+x).style.MozOpacity = 1;
}
}
}
op -= 5;
setTimeout("over("+id+");", 20);
}
}
opl = 40;
function out(id) {
if (opl <= 80)
{
if (document.all)
{
for(x=0;x<5;x++)
{
if(x != id)
{
obj.filters.alpha.opacity = opl;
}
else
{
obj.filters.alpha.opacity = 80;
}
}
}
else
{
for(x=0;x<5;x++)
{
if(x != id)
{
document.getElementById("mintxt"+x).style.MozOpacity = opl / 100;
}
else
{
document.getElementById("mintxt"+x).style.MozOpacity = 0.8;
}
}
}
opl += 5;
setTimeout("out("+id+");", 20);
}
}
</script>
<style type="text/css">
body {background-color: #000000;}
.link {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 10px; font-style: normal; font-weight: bold; color: #FFFFFF; line-height: 120%;text-decoration: none;filter:alpha(opacity=0);-moz-opacity:0;}
.link a{font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 10px; font-style: normal; font-weight: bold; color: #FFFFFF; line-height: 120%;text-decoration: none;filter:alpha(opacity=50);-moz-opacity:0;}
.link a:hover{font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 10px; font-style: normal; font-weight: bold; color: #666666; line-height: 120%;text-decoration: underline;filter:alpha(opacity=0);-moz-opacity:0;}
</style></head>
<body onload="fadeind(0);">
<table width="500" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="119" height="25"><div align="left"><a href="fade.php" id="mintxt0" class="link" onMouseOver="over(0);" onMouseOut="out(0);">Fading1</a></div></td>
<td width="119" height="25"><div align="left"><a href="fade.php" id="mintxt1" class="link" onMouseOver="over(1);" onMouseOut="out(1);">Fading2</a></div></td>
<td width="119" height="25"><div align="left"><a href="fade.php" id="mintxt2" class="link" onMouseOver="over(2);" onMouseOut="out(2);">Fading3</a></div></td>
<td width="119" height="25"><div align="left"><a href="fade.php" id="mintxt3" class="link" onMouseOver="over(3);" onMouseOut="out(3);">Fading4</a></div></td>
<td width="119" height="25"><div align="left"><a href="fade.php" id="mintxt4" class="link" onMouseOver="over(4);" onMouseOut="out(4);">Fading5</a></div></td>
</tr>
</table>
</body>
</html>
