Full version: jsB@nk » Text » Animation » Sequential fly-in text script
URL: https://www.javascriptbank.com/sequential-fly-in-text-script.html
This script flies in multiple text from the left edge of the window, one at a time in sequential order similar to a PowerPoint effect. It's versatile enough to handle any number of text (or other rich HTML like images!), and you can customize both the animation speed and pause between each message. A nice effect to highlight important points on your page.
Full version: jsB@nk » Text » Animation » Sequential fly-in text script
URL: https://www.javascriptbank.com/sequential-fly-in-text-script.html
<style type="text/css">.glidetext{position: relative;/*Set initial position of your text. Make it just enough to hide the text from view:*/left: -500px;}</style><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><script type="text/javascript">//Sequential fly-in text script- by JavaScriptKit.com//For this script and 400+ more, visit http://www.javascriptkit.com//This notice must stay intact for usevar pausebetweenmsg=10 //customize pause in miliseconds between each message showing up (3000=3 seconds)var glidespeed=50 //customize glide speed in pixels per frame.var curobjindex=0function actualstyle(el, cssproperty){if (el.currentStyle)return el.currentStyle[cssproperty]else if (window.getComputedStyle){var elstyle=window.getComputedStyle(el, "")return elstyle.getPropertyValue(cssproperty)}}function collectElementbyClass(){var classname="glidetext"glidearray=new Array()var inc=0var alltags=document.all? document.all : document.getElementsByTagName("*")for (i=0; i<alltags.length; i++){if (alltags[i].className==classname)glidearray[inc++]=alltags[i]}if (glidearray.length>0)onebyoneglide()}function onebyoneglide(){if (curobjindex<glidearray.length)glidetimer=setInterval("glideroutine()",50)}function glideroutine(){if (parseInt(actualstyle(glidearray[curobjindex], "left"))<0)glidearray[curobjindex].style.left=parseInt(actualstyle(glidearray[curobjindex], "left"))+50else{glidearray[curobjindex].style.left=0curobjindex++clearInterval(glidetimer)setTimeout("onebyoneglide()", pausebetweenmsg)}}if (window.addEventListener)window.addEventListener("load", collectElementbyClass, false)else if (window.attachEvent)window.attachEvent("onload", collectElementbyClass)else if (document.getElementById)window.onload=collectElementbyClass</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><div class="glidetext"><b>Reload this page to run again</b></div><div class="glidetext">This is text 1</div><p class="glidetext">Another text (or image) <img src="../image/gif_logojsb2.gif"></p><div class="glidetext">This is text 3</div><div class="glidetext">This is text 4</div><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->