В этой статье описывается метод JS, чтобы реализовать текстовую ссылку, чувствующую мышь, исчезает и выходит, чтобы изменить цвет. Поделитесь этим для вашей ссылки. Конкретный метод реализации следующим образом:
Скопируйте код следующим образом: <! Doctype html public "-// w3c // dtd html 4.0 transitional // en">
<html>
<Голова>
<TILE> JS реализует текстовую ссылку, чувствующая мышь, исчезает и выходит, чтобы изменить цвет </title>
</Head>
<Тело>
<script language = "javascript" type = "text/javascript">
startColor = "#671700"; // Определите цвет ссылки
endColor = "#D8D1C5"; // Определите цвет как градиент до последнего
Stepin = 17;
шаг = 23;
/*
Определите, автоматически градивать все текстовые ссылки, True - это да, ложь - нет
*/
Autofade = true;
/*
Вот класс класса: Fade в стиле CSS. Если это правда, то вам нужно добавить этот стиль затухания к ссылке, которую вы хотите градиентировать.
*/
sloppyclass = false;
hexa = new Makearray (16);
для (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 = dexize (startColor.tolowerCase ());
endColor = dexize (endColor.tolowerCase ());
var fadeid = new Array ();
Функция dehexize (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;
}
функция domouseover () {
if (document.all) {
var srcelement = event.srcelement;
if ((srcelement.tagname == "a" && autofade) || srcelement.classname == "fade" || (sloppyclass && srcelement.classname.indexof ("fade")! = -1)))
FADE (Startcolor, Endcolor, Srcelement.uniqueid, Stepin);
}
}
функция domouseout () {
if (document.all) {
var srcelement = event.srcelement;
if ((srcelement.tagname == "a" && autofade) || srcelement.classname == "fade" || (sloppyclass && srcelement.classname.indexof ("fade")! = -1)))
FADE (EndColor, Startcolor, Srcelement.uniqueid, Stepout);
}
}
функция makearray (n) {
this.length = n;
для (var i = 1; i <= n; i ++)
это [i] = 0;
вернуть это;
}
функция hex (i) {
if (i <0)
вернуть "00";
иначе if (i> 255)
вернуть "ff";
еще
возврат "" + 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;
}
Функция FADE (S, E, элемент, шаг) {
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] = settimeout ("setcolor (math.floor (" + sr + " * ((" + step + " -" + i + ")/" + step + ") +" + er + " * (" + i + "/" +
step + ")), math.floor (" + sg + " * ((" + step + " -" + i + ")/" + step + ") +" + eg + " * (" + i + "/" + step +
")), Math.floor ("+sb+" * (("+step+"-"+i+")/"+step+")+"+eb+" * ("+i+"/"+step+")),"+element+");", i * step);
}
fadeid [0] = element;
}
</script>
<p> <a href = "// www.vevb.com"> Поместите мышь на эту текстовую ссылку, чтобы просмотреть эффект предварительного просмотра </a> </p>
</Body>
</Html>
Я надеюсь, что эта статья будет полезна для каждого программирования JavaScript.