Linkfarben faden bei MouseOver/Out: Faden geht, aber nicht immer... - #24864 (HTML, CSS und Javascript)

Netspider

2003-09-27 21:32

User since
2003-09-25
49 Artikel
BenutzerIn

Hi,

ich hab auf einigen Internetseiten Links gesehen,
die bei mouseover/out von einer farbe zur anderen faden,
ich dachte mir, das kannst du doch auch!

so, nun habe ich angefangen, klappt bis jetzt alles gut,
ABER wenn ich mit der Maus von einem Link direkt zum anderen gehe, fadet der erste nicht wieder zurück und der 2. fadet zu schwarz, also ihm fehlt die farbe, wohin er faden soll.

ich weiß aber nicht, woran es liegen soll!

ich habe alle variablen schon als objekt-eigenschaften der links gesetzt, aber es funktioniert einfach nicht:

[html]
<html>
<head>
<title>Neu</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="style2.css">
</head>
<body>
<script language="Javascript">
maxschritt=10;
step=1;//Millisek
ovrlink='#FFFFFF';
outlink='#6890B6';

//#########################################

if(ovrlink.substr(0,1)=='#') ovrlink=ovrlink.substr(1,ovrlink.length-1);
if(outlink.substr(0,1)=='#') outlink=outlink.substr(1,outlink.length-1);

function fade(was)
{
with(was)
{
vrot=parseInt(von.substr(0,2),16);
vgruen=parseInt(von.substr(2,2),16);
vblau=parseInt(von.substr(4,2),16);
brot=parseInt(bis.substr(0,2),16);
bgruen=parseInt(bis.substr(2,2),16);
bblau=parseInt(bis.substr(4,2),16);

if(brot<=vrot) // wird kleiner
{ rdiff=(vrot-brot);
rnimm=maxschritt-1;
rklein=brot;
}
else // wird größer
{ rdiff=(brot-vrot);
rnimm=2*schritt;
rklein=vrot;
}

if(bgruen<=vgruen) // wird kleiner
{ gdiff=(vgruen-bgruen);
gnimm=maxschritt-1;
gklein=bgruen;
}
else // wird größer
{ gdiff=(bgruen-vgruen);
gnimm=2*schritt;
gklein=vgruen;
}

if(bblau<=vblau) // wird kleiner
{ bdiff=(vblau-bblau);
bnimm=maxschritt-1;
bklein=bblau;
}
else // wird größer
{ bdiff=(bblau-vblau);
bnimm=2*schritt;
bklein=vblau;
}

rot=Math.round(rklein+((rnimm-schritt)/(maxschritt-1))*rdiff).toString(16);
gruen=Math.round(gklein+((gnimm-schritt)/(maxschritt-1))*gdiff).toString(16);
blau=Math.round(bklein+((bnimm-schritt)/(maxschritt-1))*bdiff).toString(16);
if(rot.length<2)rot='0'+rot;
if(gruen.length<2)gruen='0'+gruen;
if(blau.length<2)blau='0'+blau;
neu='#'+rot+gruen+blau;
}
was.style.color=was.neu;
was.schritt++;
w=was;
if(was.schritt<maxschritt)
was.id=setTimeout('fade(w)',step);
}

function f(was,von,bis)
{
was.von=new Object();
was.bis=new Object();
was.schritt=new Object();
was.id=new Object();

was.vrot=new Object();
was.vgruen=new Object();
was.vblau=new Object();
was.brot=new Object();
was.bgruen=new Object();
was.bblau=new Object();
was.rot=new Object();
was.gruen=new Object();
was.blau=new Object();
was.rdiff=new Object();
was.gdiff=new Object();
was.bdiff=new Object();
was.rnimm=new Object();
was.gnimm=new Object();
was.bnimm=new Object();
was.rklein=new Object();
was.gklein=new Object();
was.bklein=new Object();
was.neu=new Object();

was.von=von;
was.bis=bis;
was.schritt=1;

fade(was);
}
</script>
<a href="javascript:alert('Moin');"
onmouseover="f(document.links[0],outlink,ovrlink)"
onmouseout= "f(document.links[0],ovrlink,outlink)"
>hier drüber</a><br>

<a href="javascript:alert('Moin');"
onmouseover="f(document.links[1],outlink,ovrlink)"
onmouseout= "f(document.links[1],ovrlink,outlink)"
>hier drüber</a><br>

<a href="javascript:alert('Moin');"
onmouseover="f(document.links[2],outlink,ovrlink)"
onmouseout= "f(document.links[2],ovrlink,outlink)"
>hier drüber</a>

</body>
</html>
[/html]

Bitte helft mir!

Cu, Netspider

[Edit]Hab die Smiles mal ausgemacht[/Edit]\n\n

perl -e "s;;Ronny Lindner;;m;(..).$;;$l=$1;s;n;;g;m;.{4}$;;$_=$l;$I=$&;m;^(.);;$_.='ts';$_.=$1;$_++;$_++;$_.=$I;print ucfirst;"