Full version: jsB@nk » Text » Fade-Glow » Dissolving text effect
URL: https://www.javascriptbank.com/dissolving-text-effect.html
This is a great DHTML script that rotates and displays any number of messages, with a unique dissolving effect applied during each rotation. The effect is archived by first positioning a semi transparent, 'spotty' image behind the message, and performing a 'wipe' action over it (see documentation inside script). As seen below, the result is nothing short of spectacular...Note that this script requires that the text to be displayed be absolutely positioned on the page. In plain English, that means you'll need to specify exactly a left and top coordinate (relative to the page) when defining where the text should appear.
Full version: jsB@nk » Text » Fade-Glow » Dissolving text effect
URL: https://www.javascriptbank.com/dissolving-text-effect.html
<style type="text/css">.textstyle{position:absolute;left:-2000px; width:400px; font-family:Arial; font-size:20pt; font-weight:bold; text-align:center;color:FFFFFF; filter:glow(color=red,strength=2);}.coverstyle{position:absolute;left:-2000px;}</style><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><script LANGUAGE="JavaScript1.2">// Dissolving text effect - By Peter Gehrig (http://www.24fun.ch/)var message = new Array()message[0]="JavaScriptBank.com"message[1]="Bank of over 2000+ free JavaScripts"var i_message=0// vi tri xuat hien cua chu (pixels).var covertop=20var coverleft=150// kich thuoc cua anh, neu muon thay doi kich thuoc ban nen tao mot anh moivar coverwidth=1200var coverheight=96var texttop=covertopvar textleft=coverleft//do rong cua chu can ap dung hieu ungvar textwidth=400var textheight=coverheightvar cliptop=0var clipright=textwidthvar clipbottom=coverheightvar clipleft=0var clippoints// toc do thuc hien hieu ungvar step=40var pause=50var timerfunction init() { if (document.all) { document.all.text.style.posTop=texttop document.all.text.style.posLeft=textleft document.all.cover.style.posTop=covertop document.all.cover.style.posLeft=coverleft clipleft=0 fadeout() }}function fadeout() { if (document.all.cover.style.posLeft >=(-coverwidth+textwidth+coverleft+step)) { clipleft+=step clipright=clipleft+textwidth clippoints="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"document.all.cover.style.clip=clippoints document.all.cover.style.posLeft-=step timer= setTimeout("fadeout()",pause) } else { clearTimeout(timer) i_message++ if (i_message>=message.length) {i_message=0} text.innerHTML=message[i_message] fadein() }}function fadein() { if (document.all.cover.style.posLeft <=coverleft) { clipleft-=step clipright=clipleft+textwidth clippoints="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"document.all.cover.style.clip=clippoints document.all.cover.style.posLeft+=step timer= setTimeout("fadein()",pause) } else { clearTimeout(timer) init() }}</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><script language="JavaScript1.2">if (document.all&&window.print){document.write('<DIV ID="text" class="textstyle">'+message[0]+'</div>')document.write('<DIV ID="cover" class="coverstyle"><img src="slidefader.gif"></DIV>')}</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->http://javascriptbank.com/javascript/text/slidefader.gif