この記事では、JSの方法について説明して、色を変えるためにマウスがフェードしているテキストリンクを認識しています。参照のためにそれを共有してください。特定の実装方法は次のとおりです。
コードを次のようにコピーします：<！Doctype HTML public " - // w3c // dtd html 4.0 transitional // en">
<html>
<head>
<Title> JS実装テキストリンクSENSING MOUSE FADE INおよびOUT OUT OUT COLOR </Title>
</head>
<body>
<スクリプト言語= "javascript" type = "text/javascript">
startcolor = "＃671700"; //リンク色を定義します
endcolor = "＃d8d1c5"; //最後の勾配である色を定義します
stepin = 17;
ステップアウト= 23;
/*
すべてのテキストリンクを自動的にグラデーションするかどうかを定義します、trueはyes、false is no
*/
autofade = true;
/*
これがクラスクラスです：CSSスタイルのフェード。本当なら、このフェードスタイルをグラデーションするリンクに追加する必要があります。
*/
sloppyclass = false;
hexa = new Makearray（16）;
for（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（）;
関数はdeexize（color）{
var colorarr = new makearray（3）;
for（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;
それ以外
colorarr [math.floor（（i-1）/2）]+= eval（j）;
}
}
}
colorarrを返します。
}
function domouseover（）{
if（document.all）{
var srcelement = event.srcelement;
if（（srceement.tagname == "a" && autofade）|| srcelement.classname == "fade" ||（sloppyclass && srcelement.classname.indexof（ "fade"）！= -1）））
フェード（StartColor、Endcolor、srcelement.uniqueid、stepin）;
}
}
function domouseout（）{
if（document.all）{
var srcelement = event.srcelement;
if（（srceement.tagname == "a" && autofade）|| srcelement.classname == "fade" ||（sloppyclass && srcelement.classname.indexof（ "fade"）！= -1）））
フェード（endcolor、startcolor、srcelement.uniqueid、stepout）;
}
}
function makearray（n）{
this.length = n;
for（var i = 1; i <= n; i ++）
この[i] = 0;
これを返します。
}
関数hex（i）{
if（i <0）
"00"を返します。
else if（i> 255）
"ff"を返します。
それ以外
return "" + hexa [math.floor（i/16）] + hexa [i％16];}
関数setcolor（r、g、b、element）{
var hr = hex（r）; var hg = hex（g）; var hb = hex（b）;
element.style.color = "＃"+hr+hg+hb;
}
function Fade（s、e、element、step）{
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、EVAL（Fadeid [0]））;
var i = 1;
while（i <fadeid.length）{
cleartimeout（fadeid [i]）;
i ++;
}
}
for（var i = 0; i <= step; i ++）{
fadeid [i + 1] = setimeout（ "setcolor（math.floor（" + sr + " *（（" + step + " - " + i + "）/" + "） +" + er + " *（" + i + "/" +
step + "））、math.floor（" + sg + " *（（" + step + " - " + i + "）/" + step + "） +" + " + eg +"（ " + i +"/ " + step +
"）、math.floor（"+sb+" *（（"+step+" - "+i+"）/"+step+"）+"+"+eb+"（ "+i+"/"+step+"）、 "+要素+"; "、i * step）;
}
fadeid [0] = element;
}
</script>
<p> <a href = "// www.vevb.com">このテキストリンクにマウスを置いて、プレビュー効果を表示</a> </p>
</body>
</html>
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。