Phiên bản đầy đủ: jsB@nk » Liên kết » Chú thích » Liên kết có chú thích mờ dần
URL: https://www.javascriptbank.com/textual-tooltip-ii.html
Liên kết có chú thích bằng chữ ngay bên dưới khi rê con trỏ chuột đến, chú thích xuất hiện theo kiểu chớp sáng rồi mờ dần.
Phiên bản đầy đủ: jsB@nk » Liên kết » Chú thích » Liên kết có chú thích mờ dần
URL: https://www.javascriptbank.com/textual-tooltip-ii.html
<script>// Textual tooltip II (fade into view)// Roy Whittle , [email protected]// http://www.roy.whittle.com/var FadingObject = new Array();var FadeRunning=false;var FadeInterval=30;var hexDigit=new Array("0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F");function dec2hex(dec){return(hexDigit[dec>>4]+hexDigit[dec&15]);}function hex2dec(hex){return(parseInt(hex,16))}function createFaderObject(theDiv, numSteps, startColor){if(!startColor)startColor = "000000";this.name= theDiv;this.text= null;this.color= "FFFFFF";this.next_text= null;this.next_color= null;this.state= "OFF";this.index= 0;this.steps= numSteps;this.r= hex2dec(startColor.slice(0,2));this.g= hex2dec(startColor.slice(2,4));this.b= hex2dec(startColor.slice(4,6));}function FadingText(theDiv, numSteps, startColor){FadingObject[theDiv] = new createFaderObject(theDiv, numSteps, startColor);}function start_fading(){if(!FadeRunning)FadeAnimation();}function set_text(f){if(navigator.appName.indexOf("Netscape") != -1&& document.getElementById){var theElement = document.getElementById(f.name);var newRange = document.createRange();newRange.setStartBefore(theElement);var strFrag = newRange.createContextualFragment(f.text);while (theElement.hasChildNodes())theElement.removeChild(theElement.lastChild);theElement.appendChild(strFrag);theElement.style.color="#"+f.startColor;}}function getColor(f){var r=hex2dec(f.color.slice(0,2));var g=hex2dec(f.color.slice(2,4));var b=hex2dec(f.color.slice(4,6));r2= Math.floor(f.r+(f.index*(r-f.r))/(f.steps) + .5);g2= Math.floor(f.g+(f.index*(g-f.g))/(f.steps) + .5);b2= Math.floor(f.b+(f.index*(b-f.b))/(f.steps) + .5);return("#" + dec2hex(r2) + dec2hex(g2) + dec2hex(b2));}function setColor(fadeObj){var theColor=getColor(fadeObj);var str="<FONT COLOR="+ theColor + ">" + fadeObj.text + "</FONT>";var theDiv=fadeObj.name;//if IE 4+if(document.all){document.all[theDiv].innerHTML=str;}//else if NS 4else if(document.layers){document.nscontainer.document.layers[theDiv].document.write(str);document.nscontainer.document.layers[theDiv].document.close();}//else if NS 6 (supports new DOM, may work in IE5) - see Website Abstraction for more info.//http://www.wsabstract.com/javatutors/dynamiccontent4.shtmlelse if (document.getElementById){theElement = document.getElementById(theDiv);theElement.style.color=theColor;}}function fade_up(theDiv, newText, newColor){var f=FadingObject[theDiv];if(newColor == null)newColor="FFFFFF";if(f.state == "OFF"){f.text = newText;f.color = newColor;f.state = "FADE_UP";set_text(f);start_fading();}else if( f.state == "FADE_UP_DOWN"|| f.state == "FADE_DOWN"|| f.state == "FADE_DOWN_UP"){if(newText == f.text)f.state = "FADE_UP";else{f.next_text = newText;f.next_color = newColor;f.state = "FADE_DOWN_UP";}}}function fade_down(theDiv){var f=FadingObject[theDiv];if(f.state=="ON"){f.state="FADE_DOWN";start_fading();}else if(f.state=="FADE_DOWN_UP"){f.state="FADE_DOWN";f.next_text = null;}else if(f.state == "FADE_UP"){f.state="FADE_UP_DOWN";}}function FadeAnimation(){FadeRunning = false;for (var d in FadingObject){var f=FadingObject[d];if(f.state == "FADE_UP"){if(f.index < f.steps)f.index++;elsef.index = f.steps;setColor(f);if(f.index == f.steps)f.state="ON";elseFadeRunning = true;}else if(f.state == "FADE_UP_DOWN"){if(f.index < f.steps)f.index++;elsef.index = f.steps;setColor(f);if(f.index == f.steps)f.state="FADE_DOWN";FadeRunning = true;}else if(f.state == "FADE_DOWN"){if(f.index > 0)f.index--;elsef.index = 0;setColor(f);if(f.index == 0)f.state="OFF";elseFadeRunning = true;}else if(f.state == "FADE_DOWN_UP"){if(f.index > 0)f.index--;elsef.index = 0;setColor(f);if(f.index == 0){f.text = f.next_text;f.color = f.next_color;f.next_text = null;f.state ="FADE_UP";set_text(f);}FadeRunning = true;}}/*** Check to see if we need to animate any more frames. ***/if(FadeRunning)setTimeout("FadeAnimation()", FadeInterval);}FadingText('fade1', 10,"FFFFFF");FadeInterval=30;</SCRIPT><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><A HREF="http://www.JavaScriptBank.com" onMouseOver="fade_up('fade1','<FONT SIZE=4 FACE=Verdana><TABLE border=0>Textual tooltip II (fade into view) this link</TABLE></FONT>','000000')" onMouseOut="fade_down('fade1')">JavaScriptBank.com</A><script language="JavaScript1.2">if (document.layers){document.write('<ilayer name="nscontainer" width="100%" height="100">')document.write('<layer name="fade1" width="100%" height="100">')document.write('</layer></ilayer>')}elsedocument.write('<DIV ID="fade1"></DIV>')</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->