Full version: jsB@nk » Text » TextMagnet
URL: https://www.javascriptbank.com/textmagnet.html
Great animation for your news! TextMagnet script reassembles your messages from small portions of text that are randomly spread out all over the screen. The script draws the text-chunks together like a strong magnet! Made for IE5 and higher.
Full version: jsB@nk » Text » TextMagnet
URL: https://www.javascriptbank.com/textmagnet.html
<STYLE>.spanstyle {BACKGROUND-COLOR: #004400; BORDER-BOTTOM-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-RIGHT-STYLE: solid; BORDER-TOP-STYLE: solid; COLOR: olive; FONT-FAMILY: Arial Black; FONT-SIZE: 28px; FONT-STYLE: italic; HEIGHT: 90px; LEFT: -5000px; PADDING-BOTTOM: 5px; PADDING-LEFT: 5px; PADDING-RIGHT: 5px; PADDING-TOP: 5px; POSITION: absolute; TEXT-ALIGN: center; WIDTH: 280px}</STYLE><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><SCRIPT><!-- Beginning of JavaScript -// TextMagnet// CONFIGURATION:// 1. Copy and paste the two script-blocks into your HTML-file:// Put the first script-block inside the head-section of your HTML-file.//Put the second script-block right at the end of the //body-section of your HTML-file.// 2.Copy and paste the style-sheet into head-section of your HTML-file.//Configure font, font-size, font-color, background-color etc.// 3. Insert 'onLoad="changetext()"' into the body tag.// 4. Configure the variables below:// The width of your textbox (pixels). var textwidth=300// The height of your textbox (pixels). var textheight=150// Your messages. You may add as many messages as you like.var message=new Array()message[0]="Are you happy?"message[1]="Are you married?"message[2]="Or both?"message[3]="Then you must be a very lucky person."// Final horizontal position of the image: distance to the left margin of the window// If you set this to '-1' the textbox will centered in the middle of the browser-windowvar x_finalpos=-1// Final vertical position of the image: distance to the top margin of the window// If you set this to '-1' the textbox will centered in the middle of the browser-windowvar y_finalpos=50// Number of sliced cells (the higher this value the slower the script)var x_slices=24// Number of sliced rows (the higher this value the slower the script)var y_slices=1// Speed of the reassembling effect. More means slower.var pause=10// The width and heigth of the zone where the debris of the message are spread (pixels)var screenwidth=900var screenheight=600// Do not change the variables belowvar x_step=new Array()var y_step=new Array()var x_randompos=0var y_randompos=0var i_loop=0var max_loop=30var i_text=0var width_slice=Math.floor(textwidth/x_slices)var height_slice=Math.floor(textheight/y_slices)var cliptop=0var clipbottom=height_slicevar clipleft=0var clipright=width_slicevar spancounter=0function initiate() {if (x_finalpos==-1) {x_finalpos=Math.floor(document.body.clientWidth/2)-Math.floor(textwidth/2)}if (y_finalpos==-1) {y_finalpos=Math.floor(document.body.clientHeight/2)-Math.floor(textheight/2)}cliptop=0clipbottom=height_sliceclipleft=0clipright=width_slicei_loop=0spancounter=0 if (document.all) { for (i=0;i<=y_slices-1;i++) {for (ii=0;ii<=x_slices-1;ii++) {var thisspan=eval("document.all.span"+spancounter+".style")x_randompos=Math.ceil(screenwidth*Math.random())y_randompos=Math.ceil(screenheight*Math.random())thisspan.posLeft=x_randomposthisspan.posTop=y_randompos thisspan.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"clipleft+=width_slice clipright+=width_slice spancounter++} clipleft=0 clipright=width_slice cliptop+=height_slice clipbottom+=height_slice} } explode_IE()}function changetext() {spancounter=0for (i=0;i<=y_slices-1;i++) {for (ii=0;ii<=x_slices-1;ii++) {var thisspan=eval("document.all.span"+spancounter+".style")thisspan.posLeft=-5000spancounter++}}spancounter=0if (i_text>message.length-1) {i_text=0}for (i=0;i<=y_slices-1;i++) {for (ii=0;ii<=x_slices-1;ii++) {var thisinnerspan=eval("span"+spancounter) thisinnerspan.innerHTML=message[i_text]spancounter++}}i_text++initiate()}function explode_IE() {spancounter=0if (i_loop<=max_loop-1) {for (i=0;i<=y_slices-1;i++) {for (ii=0;ii<=x_slices-1;ii++) {var thisspan=eval("document.all.span"+spancounter+".style")x_step[spancounter]=(x_finalpos-thisspan.posLeft)/(max_loop-i_loop)y_step[spancounter]=(y_finalpos-thisspan.posTop)/(max_loop-i_loop)thisspan.posLeft+=x_step[spancounter]thisspan.posTop+=y_step[spancounter]spancounter++}}i_loop++var timer=setTimeout("explode_IE()",pause)}else {spancounter=0clearTimeout(timer)var timer=setTimeout("changetext()",2000)}}// - 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 onload=changetext()><SCRIPT><!-- Beginning of JavaScript -if (document.all) {for (i=0;i<=y_slices-1;i++) {for (ii=0;ii<=x_slices-1;ii++) { document.write("<span id='span"+spancounter+"' class='spanstyle'></span>")spancounter++}}spancounter=0}// - 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-->