Dissolve text using JavaScript

**venu_1200** · 08-13-2008, 06:15 AM

Hi

I done HTML Static pages for that page i need javascript to dissolve the text plz any one guide how to do that.

this is the like
www.reefvilla.com

in this i wont dissolve text "leave only footprints behind" to "the ultimate tropical beach villa"
plz any one help me to slove the my problem

thank you in advence.

**Jesdisciple** · 08-14-2008, 01:05 AM

I looked through the DD archives and found the Dissolving Text Effect, but it only works in IE5. Can anyone tell me what the IE-only CSS does and why it can't be ported to other browsers? As far as I can tell, the entire JS should port fine.

**rangana** · 08-14-2008, 07:51 AM

Hope this helps:

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html><head><title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#wrap{width:500px;padding:10px;border:3px double #999;
font-family:arial,helvetica,serif;
font-size:20pt;text-align:center;margin:30px auto;}
#message{height:1%;color:#930;filter:alpha(opacity=0);opacity:0;}
</style>
<script type="text/javascript">
/*
Code Title: Dissolve Text
Author: Raymond Angana
Created: August 14, 2008
rangana in dynamicdrive.com/forums
This notice must stay intact for legal use
*/
var txt=['Leave only footprints behind...','The ultimate tropical beach villa.'],
init=0,i=0,k=0,speed=50,el;
function fade(){
init==0?i++:i--;
el.filters?el.style.filter='alpha(opacity='+i+')':el.style.opacity=i/100;
el.firstChild.nodeValue=txt[k];
if(i==100)init=1;
if(i==0) {init=0;k++;}
if(k==txt.length)k=0;
setTimeout('fade()',speed);}
window.onload=function(){el=document.getElementById('message');fade();}
</script>
</head><body><div id="wrap"><div id="message">&nbsp;</div></div></body></html>

**sandyk3** · 08-15-2008, 04:48 AM

rangana,
I've saved this script on my drive - it's really nice and I think I'll be using it sometime. Is this a Dynamic Drive script? How do I put the credit in for this script??

Thanks!
Sandy k

**rangana** · 08-15-2008, 04:55 AM

It's not a DD script. It was done by request.
Anyway, you can freely use that code. I've edited the code above to depict the credit.

**aliasjanedoe** · 02-08-2012, 11:49 PM

I know this post is old, but I just stumbled across it. It's brilliant, rangana! Is there a way that I can put line breaks in it? I want to use it for longer amounts of text.

Thread: Dissolve text using JavaScript

Thread Tools

Search Thread

Dissolve text using JavaScript

Bookmarks

Bookmarks

Posting Permissions