»
Tiếng AnhTiếng PhápTiếng Việt

In - Liên kết có hộp thoại chú thích - JavaScriptBank.com

Phiên bản đầy đủ: jsB@nk » Liên kết » Chú thích » Liên kết có hộp thoại chú thích
URL: https://www.javascriptbank.com/links-with-growing-tooltips.html

Liên kết có hộp thoại chú thích © JavaScriptBank.comHiệu ứng tạo ra các hộp thoại chú thích cho liên kết khi ta rê con trỏ chuột đến, các hộp thoại này sẽ xuất hiện với kích thước tăng dần cho đến khi hiển thị hết thông tin trong hộp thoại.

Phiên bản đầy đủ: jsB@nk » Liên kết » Chú thích » Liên kết có hộp thoại chú thích
URL: https://www.javascriptbank.com/links-with-growing-tooltips.html



CSS
<STYLE type=text/css>A.LINKS {BACKGROUND-COLOR: #000; BORDER-BOTTOM: #00ff00 1px groove; BORDER-LEFT: #00ff00 1px groove; BORDER-RIGHT: #00ff00 1px groove; BORDER-TOP: #00ff00 1px groove; COLOR: #00ff00; FONT-WEIGHT: 900}A.LINKS:hover {COLOR: #fff}SPAN.Alt {BACKGROUND-COLOR: black; BORDER-BOTTOM: #00ff00 3px groove; BORDER-LEFT: #00ff00 3px groove; BORDER-RIGHT: #00ff00 3px groove; BORDER-TOP: #00ff00 3px groove; COLOR: #00ff00; POSITION: absolute; VISIBILITY: hidden; WIDTH: 0px; Z-INDEX: 1}</STYLE><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<SCRIPT language=JavaScript type=text/javascript>// - *** Edit Script in Body Section of Document . . . ***var jsbank;var jeTPring;var DHTML=ALink=URLS=new Array();var toggle=true;var DynamicResizer=DynamicFSResizer=0;var OFFSET=10; // - OFFSET form cursorvar WIDTH=200; // - Max widthvar MaxFS=20; // - Max Font Sizevar AMT=5; // - Amount to add each cycle when resizingvar TIMEOUT=30; // - Number in Milliseconds for timeoutvar T; // - Timerwindow.onload=setXY;window.document.onmousemove=followMOUSE;function setXY(){  if(navigator.appName=="Netscape")document.captureEvents(Event.MOUSEMOVE);setVars();}function setVars(){   jeTPring=document.getElementById('DISPLAY');}function followMOUSE(e){  jeTPring.style.left=(navigator.appName=="Netscape")?e.PageX:event.clientX+OFFSET;jeTPring.style.top=(navigator.appName=="Netscape")?e.PageY:event.clientY+OFFSET;}function creatDHTML(SCRIPTING) // - Show ToolTip{  jeTPring.innerHTML=DHTML[SCRIPTING];jeTPring.className="Alt";jeTPring.style.visibility="visible";toggle=true;EFFECT();}function DynamicHTML()// - Hide ToolTip{  jeTPring.style.visibility="hidden";DynamicFSResizer=0;DynamicResizer=0;toggle=false;clearTimeout(T);}function EFFECT(){  if(toggle){ if(DynamicResizer<WIDTH) {   with(jeTPring.style) {   width=DynamicResizer; fontSize=DynamicFSResizer; } if(DynamicFSResizer<=MaxFS)DynamicFSResizer++; DynamicResizer+=AMT; }} T=setTimeout("EFFECT();",TIMEOUT);}function HAWAII(){jsbank="http://JavaScriptBank.com";location.href=jsbank;}</SCRIPT><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<DIV id=JavaScripts name="Dynamic"><SCRIPT language=JavaScript type=text/javascript><!--/* - ALink, DHTML, URLS should all have the same number of entries */// - Edit variable Below ( ie.  <variable>=["<item 1>","<item 2>","<item 3>","<item 4>","<item 5>","<item 6>"];  )//- START MODIFICATIONS ALink=["One","Two","Three","Four","Five"]; // - Link Lables DHTML=["This is a discription of item number one ...","A Description of Item TWO Goes HERE ...","Item Number Three's Description goes here . . .","Number Four and still Strong . . .","Dynamic Scripts Rule!!!"]; // - ToolTips URLS=["http://JavaScriptBank.com","http://JavaScriptBank.com","http://JavaScriptBank.com","http://JavaScriptBank.com","http://JavaScriptBank.com"]; // - Web Address (URL)// - END MODIFICATIONS   if(DHTML.length<ALink.length)DHTML.length=ALink.length; for(var scripts=0;scripts<ALink.length;scripts++)  document.write('<a href="'+URLS[scripts]+'" class="LINKS" onmouseover="creatDHTML('+scripts+')" onmouseout="DynamicHTML()">'+ALink[scripts]+'</a><b style="visibility:hidden;">_</b>'); if(navigator.appName=="Netscape")document.write("<br />");//--></SCRIPT><SPAN id=DISPLAY style="POSITION: absolute; VISIBILITY: hidden"></span></div><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->