RV's free DHTML and JavaScript text and graphic scripts

WOBBLY TEXT EFFECT
This script has been tested on and shown to work with Internet Explorer 5+, Netscape 6+, Firefox 1.0+ and Opera 7+
29-Sep-2005: Added the option for the text to be a link. 20-Aug-2005: Removed support for Internet Explorer 4.
STEP 1: Copy and paste the code below so that it sits between the <head> and </head> tags at the top of your web-page: <script type="text/javascript"> // <![CDATA[ var speed=100; // speed of wobbling, lower is faster var height=3; // height of wobbling in pixels var alink="http://www.mf2fm.com/rv"; // page to link text to (set to ="" for no link) /**************************** * Wobbly Text Effect * (c) 2003-6 mf2fm web-design * http://www.mf2fm.com/rv * * DON'T EDIT BELOW THIS BOX * ***************************/ var wobtxt, wobble, wobcnt=0; window.onload=function() { if (document.getElementById) { var i, wobli; wobble=document.getElementById("wobble"); wobtxt=wobble.firstChild.nodeValue; while (wobble.childNodes.length) wobble.removeChild(wobble.childNodes[0]); for (i=0; i<wobtxt.length; i++) { wobli=document.createElement("span"); wobli.setAttribute("id", "wobb"+i); wobli.style.position="relative"; wobli.appendChild(document.createTextNode(wobtxt.charAt(i))); if (alink) { wobli.style.cursor="pointer"; wobli.onclick=function() { top.location.href=alink; } } wobble.appendChild(wobli); } setInterval("wobbler()", speed); }} function wobbler() { for (var i=0; i<wobtxt.length; i++) document.getElementById("wobb"+i).style.top=Math.round(heightMath.sin(i+wobcnt))+"px" wobcnt++; } // ]]> </script> CLICK HERE to select the above script ready to paste it into your clipboard
STEP 2: Place a <div> element with 'id="wobble"' on your web-page containing the text you wish to go wobbly. For example: Don't include anything other than text between the <div> tags.
THAT'S IT When your page loads, the text you placed between between the <div> tags should start wobbling, like the text at the top of this page.

Copyright notice: All scripts are © copyright mf2fm.com. You can use them wherever and whenever you wish, however the copyright notice at the start of the script should remain intact and a link back to this page would be appreciated. The address for this page is: http://www.mf2fm.com/rv/dhtmlwobble.php.

This page has been viewed 650 times. It was last viewed on Fri 19 Apr, 2024 at 03:18