Full version: jsB@nk » Text » Animation » MessagePong: rush your message all over the webpage
URL: https://www.javascriptbank.com/messagepong-rush-your-message-all-over-the-webpage.html
This is probably the most spectacular way to present a message. MessagePong drives your text like a crazy snake through your webpage.
Full version: jsB@nk » Text » Animation » MessagePong: rush your message all over the webpage
URL: https://www.javascriptbank.com/messagepong-rush-your-message-all-over-the-webpage.html
<SCRIPT><!-- Beginning of JavaScript -// MessagePong by Urs Dudli and Peter Gehrig // your message. Attention: a long message will slow down the script!var your_message="JavaScriptBank.com"// font-familyvar textfont="Verdana"// font-sizevar textsize=20// font-colorvar textcolor="000"// font-weight (boldness). Set it to a value between 1 and 9var textboldness=7// speedvar tempo=40// average horizontal distance between the lettersvar stepx=30// average vertical distance between the lettersvar stepy=20// do not edit the variables belowvar msg=new Array()var msg=your_messagevar message=msg.split("")var numberofletters=msg.length-1var x,yvar marginbottomvar marginleft=0var margintop=0var marginrighttextboldness=textboldness*100var timervar xpos=new Array()var ypos=new Array()var spancontent=new Array()for (i=0; i<=numberofletters;i++) { xpos[i]=0ypos[i]=0}for (i=0;i<=numberofletters;i++) {spancontent[i]="<span style='position:relative;font-family:"+textfont+";font-size:"+textsize+"pt;color:"+textcolor+";font-weight:"+textboldness+"'>"+message[i]+"</span>"}function setValues() { var firsttimer= setTimeout("setValues2()",2000)}function setValues2() {if (document.all) { marginbottom = document.body.clientHeight-5 marginright = document.body.clientWidth-5for (i=0;i<=numberofletters;i++) { var thisspan = eval("document.all.span"+i) thisspan.innerHTML=spancontent[i]var thisspan = eval("document.all.span"+(i)+".style") thisspan.posLeft=0 thisspan.postop=0 }moveball()}if (document.layers) { marginbottom = window.innerHeight-10 marginright = window.innerWidth-10for (i=0;i<=numberofletters;i++) { var thisspan=eval("document.span"+i+".document") thisspan.write(spancontent[i])thisspan.close()var thisspan=eval("document.span"+i) thisspan.left=0 thisspan.top=0 } moveball()}}function randommaker(range) {rand=Math.floor(range*Math.random()) return rand}function moveball() {if (document.all) {checkposition() makesnake() document.all.span0.style.posTop+=stepy timer=setTimeout("moveball()",tempo)}if (document.layers) {checkposition() makesnake() document.span0.top+=stepy timer=setTimeout("moveball()",tempo)}}function makesnake() {for (i=numberofletters; i>=1; i--) { xpos[i]=xpos[i-1]ypos[i]=ypos[i-1] }if (document.all) {xpos[0]=document.all.span0.style.posLeft+stepxypos[0]=document.all.span0.style.posTop+stepyfor (i=0;i<=numberofletters;i++) { var thisspan=eval("document.all.span"+(i)+".style") thisspan.posLeft=xpos[i]thisspan.posTop=ypos[i] }}if (document.layers) {xpos[0]=document.span0.left+stepxypos[0]=document.span0.top+stepyfor (i=0;i<=numberofletters;i++) { var thisspan = eval("document.span"+i) thisspan.left=xpos[i]thisspan.top=ypos[i] }}}function checkposition() {if (document.all) {if (document.all.span0.style.posLeft>marginright) {stepx=(stepx+randommaker(2))*-1document.all.span0.style.posLeft-=1}if (document.all.span0.style.posLeft<marginleft) {stepx=(stepx+randommaker(2))*-1document.all.span0.style.posLeft+=1}if (document.all.span0.style.posTop>marginbottom) {stepy=(stepy+randommaker(2))*-1document.all.span0.style.posTop-=1}if (document.all.span0.style.posTop<margintop) {stepy=(stepy+randommaker(2))*-1document.all.span0.style.posTop+=1}}if (document.layers) {if (document.span0.left>=marginright) {stepx=(stepx+randommaker(2))*-1document.span0.left-=10}if (document.span0.left<=marginleft) {stepx=(stepx+randommaker(2))*-1document.span0.left+=10}if (document.span0.top>=marginbottom) {stepy=(stepy+randommaker(2))*-1document.span0.top-=10}if (document.span0.top<=margintop) {stepy=(stepy+randommaker(2))*-1document.span0.top+=10}}}// - End of JavaScript - --></SCRIPT><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><BODY id=thisbody onload=setValues()><SCRIPT><!-- Beginning of JavaScript -for (i=0;i<=numberofletters;i++) { document.write("<span id='span"+i+"' style='position:absolute'></span>") document.close()}// - End of JavaScript - --></SCRIPT></BODY><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->