Dynamic Drive- Wave text!

New Revised CSS Library Forums Web Tools

Wave text!

Author: Spookdog

Description: Some effects are just too complex to render using plain DHTML yet, so this one enlists the help of IE's proprietary multimedia feature to create that nifty watery, wavy effect on text. Quite mesmerizing isn't it?

Demo:

Welcome to Dynamic Drive

Directions

Step 1: Paste the below in the <HEAD> section of your page:

Select All
<Style type = "text/css"> .big { color: blue; font-family: monotype corsiva; font-size: 38pt; font-weight: bold} </style> <script language = "JavaScript"> //Wave Text! by Spookdog (spookydog3@hotmail.com) //Submitted to DynamicDrive.com //For this script and more, visit http://www.dynamicdrive.com  var TimerID; var updown = true; var str = 1; function start() { if (document.all) TimerID = window.setInterval( "wave()", 100 ); } function wave() { if ( str > 20 || str < 1 ) updown = !updown; if ( updown ) str++; else str--; wft.filters( "wave" ).phase = str * 20; wft.filters( "wave" ).strength = str; } window.onload=start </Script>

Step 2: Where you wish the wave text to appear in the <BODY>, add the below:

Technical Note

This script accesses the BODY onload event (window.onload). If you have another script on your page that does the same, one of them will not run. Click here for information on getting both scripts to work simultaneously.