Este artigo descreve o método do JS para realizar o link de texto que o link de detecção do mouse desaparece e saindo para mudar de cor. Compartilhe para sua referência. O método de implementação específico é o seguinte:
Copie o código da seguinte forma: <!
<html>
<head>
<Title> JS implementa o link de texto Sensing Mouse Fade In e Out para mudar de cor </title>
</head>
<Body>
<Script Language = "JavaScript" type = "text/javascript">
startColor = "#671700"; // Defina a cor do link
endcolor = "#d8d1c5"; // define a cor para ser gradiente para o último
Stepin = 17;
Stepout = 23;
/*
Defina se deve gradiente automaticamente todos os links de texto, true é sim, false é não
*/
Autofade = true;
/*
Aqui está a classe de classe: desaparecer no estilo CSS. Se for verdade, você precisa adicionar esse estilo de desbotamento ao link que deseja gradiente.
*/
sloppyclass = false;
Hexa = novo MakeArray (16);
para (var i = 0; i <10; i ++)
hexa [i] = i;
hexa [10] = "A"; hexa [11] = "b"; hexa [12] = "c";
hexa [13] = "d"; hexa [14] = "e"; hexa [15] = "f";
document.onMouseOver = Domaineover;
document.onmouseout = domaineout;
startColor = dehexize (startColor.tolowerCase ());
endcolor = dehexize (endcolor.tolowercase ());
var fadeId = new Array ();
função deshexize (cor) {
var colorarr = novo MakeArray (3);
para (i = 1; i <7; i ++) {
for (j = 0; j <16; j ++) {
if (color.charat (i) == hexa [j]) {
if (i%2! = 0)
colorarr [Math.floor ((i-1)/2)] = Eval (j)*16;
outro
colorarr [math.floor ((i-1)/2)]+= avaliar (j);
}
}
}
retornar colorarr;
}
função domouseover () {
if (document.all) {
var srcement = event.srcelement;
if ((srcelement.tagname == "A" && Autofade) || srcelement.className == "fade" || (sloppyclass && srcelement.classname.indexOf ("Fade")! = -1)))
Fade (startColor, endcolor, srcelement.uniqueid, Stepin);
}
}
função domouseout () {
if (document.all) {
var srcement = event.srcelement;
if ((srcelement.tagname == "A" && Autofade) || srcelement.className == "fade" || (sloppyclass && srcelement.classname.indexOf ("Fade")! = -1)))
fade (endcolor, startcolor, srcelement.uniqueid, stepout);
}
}
Função MakeArray (n) {
this.length = n;
for (var i = 1; i <= n; i ++)
este [i] = 0;
devolver isso;
}
função hex (i) {
se (i <0)
retornar "00";
caso contrário, se (i> 255)
retornar "ff";
outro
retornar "" + hexa [math.floor (i/16)] + hexa [i%16];}
função setColor (r, g, b, elemento) {
var hr = hex (r); var hg = Hex (G); var hb = hex (b);
element.style.color = "#"+hr+hg+hb;
}
Função Fade (s, e, elemento, etapa) {
var sr = s [0]; var sg = s [1]; var sb = s [2];
var er = e [0]; var eg = e [1]; var eb = e [2];
if (fadeid [0]! = null && Fade [0]! = Element) {
setColor (SR, SG, SB, EVALL (FADIDE [0]));
var i = 1;
while (i <fadeid.length) {
ClearTimeout (Fadeid [i]);
i ++;
}
}
for (var i = 0; i <= etapa; i ++) {
fadeid [i + 1] = setTimeout ("setColor (math.floor (" + sr + " * ((" + step + " -" + i + ")/" + step + ") +" + er + " * (" + i + "/" +
Etapa + ")), Math.floor (" + sg + " * ((" + etapa + " -" + i + ")/" step + ") +" + eg + " * (" + i + "/" + step +
")), Math.floor ("+sb+" * (("+step+"-"+i+")/" stapa+")+"+" * ("+i+"/"+step+"))," elemento+");", i * step);
}
fadeid [0] = elemento;
}
</script>
<p> <a href = "// www.vevb.com"> Coloque o mouse neste link de texto para visualizar o efeito de visualização </a> </p>
</Body>
</html>
Espero que este artigo seja útil para a programação JavaScript de todos.