Full version: jsB@nk » Text » Animation » Floating and fadeing messages
URL: https://www.javascriptbank.com/floating-and-fadeing-messages.html
Draw more attention to your messages by putting them into floating and fadeing message boxes. You may add as many linkable messages. Easy configuration of text, font, font-size, font-color, font-weight, background-color and border.
Full version: jsB@nk » Text » Animation » Floating and fadeing messages
URL: https://www.javascriptbank.com/floating-and-fadeing-messages.html
<SCRIPT>// Floating and fadeing message boxesvar text=new Array()var textlink=new Array()var texttarget=new Array()var textsplashcolors=new Array()/////////////////////////////////////////////////////////////////////// EDIT VALUES BELOW THIS LINE// Add or delete as many floating message boxes as you like. // Just proceed as shown below (this sample creates three message boxes)// Set the text, link and the target for your first floating message boxtext[0]="Hello you"textlink[0]="http://jsbank.topcities.com"texttarget[0]="_blank"// Set the text, link and the target for the second floating message boxtext[1]="Welcome"textlink[1]="http://jsbank.topcities.com"texttarget[1]="_blank"// Set the text, link and the target for the third floating message boxtext[2]="Have a nice time"textlink[2]="http://jsbank.topcities.com"texttarget[2]="_blank"// Set the fontvar textfont="Arial"// Set the font-weight to "bold" or "normal"var textweight="bold"// Set the rollover-colorvar textfontcolorrollover="#ff0000"// Set the font-sizevar textfontsize=12// Set the font-colorvar textfontcolor="#000000"// Set the background-colorvar textbgcolor="#dddddd"// Set the border-color var textbordercolor="#ff9000"// Set the border-width var textborder=4// DO NOT EDIT VALUES BELOW THIS LINE/////////////////////////////////////////////////////////////////////var textdecoration="none"var textfontsizeHTML=3var textweightA="<b>"var textweightB="</b>"var textitalic="normal"var textitalicA=""var textitalicB=""var textredirurl="http://"var textalign="center"var textvalign="middle"var ns4=document.layers?1:0var ns6=document.getElementById&&!document.all?1:0 var ie=document.all?1:0var floatingspeed=10var tempo=20var numberofmessages=text.length-1var stepx=new Array()var stepy=new Array()var spancontent=new Array()for (i=0;i<=numberofmessages;i++) {stepx[i]=randommaker(floatingspeed)stepy[i]=randommaker(floatingspeed)}var boxwidth=new Array()var boxheight=new Array()for (i=0;i<=numberofmessages;i++) {boxwidth[i]=10boxheight[i]=10}var x,yvar marginbottomvar marginleft=0var margintop=0var marginrightvar timervar i_fadestrength=new Array()var i_fadestep=new Array()var i_fadenow=new Array()var i_fadenowmax=new Array()for (i=0;i<=text.length;i++) {i_fadenowmax[i]=randommaker(10)+2i_fadestrength[i]=randommaker(99)i_fadestep[i]=1i_fadenow[i]=0}getcontent()function getcontent() {for (i=0;i<=numberofmessages;i++) {var content=""if (ie || ns6) {content="<table cellpadding="+textborder+" cellspacing=0 border=0><tr valign="+textvalign+"><td align="+textalign+">"content+="<a href=\""+textlink[i]+"\" target=\""+texttarget[i]+"\" style=\"position:relative;font-family:\'"+textfont+"\';font-size:"+textfontsize+"pt;font-weight:"+textweight+";text-decoration:"+textdecoration+";color:"+textfontcolor+";font-style:"+textitalic+";\" onMouseOver=\"this.style.color=\'"+textfontcolorrollover+"\'\" onMouseOut=\"this.style.color=\'"+textfontcolor+"\'\">"content+=text[i]content+="</a></td></tr></table>"}else {content="<table cellpadding="+textborder+" cellspacing=0 bgcolor="+textbgcolor+" border="+textborder+"><tr valign="+textvalign+"><td align="+textalign+">"content+="<a href=\""+textlink[i]+"\" target=\""+texttarget[i]+"\">"content+=textweightAcontent+=textitalicAcontent+="<font face=\""+textfont+"\" size="+textfontsizeHTML+" color=\""+textfontcolor+"\">"content+=text[i]content+="</font>"content+=textitalicBcontent+=textweightBcontent+="</a></td></tr></table>"}spancontent[i]=content}}function setValues() {if (ie) { marginbottom=document.body.clientHeight-5 marginright=document.body.clientWidth-5for (i=0;i<=numberofmessages;i++) { var thisspan = eval("document.all.span"+i) thisspan.innerHTML=spancontent[i]var thisspan = eval("document.all.span"+i)boxwidth[i]=thisspan.offsetWidthboxheight[i]=thisspan.offsetHeightvar maxleftstart=marginright-boxwidth[i]var maxtopstart=marginbottom-boxheight[i]var thisspan = eval("document.all.span"+(i)+".style") thisspan.posLeft=randommaker(maxleftstart)thisspan.posTop=randommaker(maxtopstart) }checkmovement()}if (ns4) { marginbottom=window.innerHeight-5 marginright=window.innerWidth-5for (i=0;i<=numberofmessages;i++) { var thisspan=eval("document.span"+i+".document") thisspan.write(spancontent[i])thisspan.close()var thisspan=eval("document.span"+i+".document")boxwidth[i]=thisspan.widthboxheight[i]=thisspan.heightvar maxleftstart=marginright-boxwidth[i]var maxtopstart=marginbottom-boxheight[i]var thisspan=eval("document.span"+i) thisspan.left=randommaker(maxleftstart)thisspan.top=randommaker(maxtopstart) } checkmovement()}if (ns6) { marginbottom=window.innerHeight-11 marginright=window.innerWidth-11for (i=0;i<=numberofmessages;i++) { var thisspan=document.getElementById('span'+i)thisspan.innerHTML=spancontent[i]var thisspan=document.getElementById('span'+i)boxwidth[i]=parseInt(thisspan.offsetWidth)boxheight[i]=parseInt(thisspan.offsetHeight)var maxleftstart=marginright-boxwidth[i]var maxtopstart=marginbottom-boxheight[i]var thisspan=document.getElementById('span'+i).style thisspan.left=parseInt(thisspan.left)+randommaker(maxleftstart)thisspan.top=parseInt(thisspan.top)+randommaker(maxtopstart) } checkmovement()}}function randommaker(range) {rand=Math.floor(range*Math.random())if (rand==0) {rand=Math.ceil(range/2)} return rand}function checkmovement() {checkposition()movepictures() timer=setTimeout("checkmovement()",tempo)}function movepictures() {if (ie) {for (i=0;i<=numberofmessages;i++) { var thisspan=eval("document.all.span"+(i)+".style") thisspan.posLeft+=stepx[i]thisspan.posTop+=stepy[i]var thisfilter=eval("span"+i)i_fadenow[i]++if (i_fadenow[i]>=i_fadenowmax[i]) {i_fadenow[i]=0if (i_fadestrength[i]>=100) {i_fadestep[i]=i_fadestep[i]*-1}else if (i_fadestrength[i]<=-20) {i_fadestep[i]=i_fadestep[i]*-1}}i_fadestrength[i]+=i_fadestep[i]thisfilter.filters.alpha.opacity=Math.round(i_fadestrength[i]) }}if (ns6) {for (i=0;i<=numberofmessages;i++) { var thisspan=document.getElementById('span'+i).style thisspan.left=parseInt(thisspan.left)+stepx[i]thisspan.top=parseInt(thisspan.top)+stepy[i]i_fadenow[i]++if (i_fadenow[i]>=i_fadenowmax[i]) {i_fadenow[i]=0if (i_fadestrength[i]>=100) {i_fadestep[i]=i_fadestep[i]*-1}else if (i_fadestrength[i]<=-20) {i_fadestep[i]=i_fadestep[i]*-1}}i_fadestrength[i]+=i_fadestep[i]document.getElementById('span'+i).style.MozOpacity=Math.round(i_fadestrength[i])/100 }}if (ns4) {for (i=0;i<=numberofmessages;i++) { var thisspan = eval("document.span"+i) thisspan.left+=stepx[i]thisspan.top+=stepy[i] }}}function checkposition() {if (ie) {for (i=0;i<=numberofmessages;i++) { var thisspan=eval("document.all.span"+i+".style")if (thisspan.posLeft>marginright-boxwidth[i]-floatingspeed) {thisspan.posLeft-=Math.abs(stepx[i]+1)stepx[i]=randommaker(floatingspeed)*-1}if (thisspan.posLeft<marginleft) {thisspan.posLeft+=Math.abs(stepx[i])stepx[i]=randommaker(floatingspeed)}if (thisspan.posTop>marginbottom-boxheight[i]-floatingspeed) {thisspan.posTop-=Math.abs(stepy[i])stepy[i]=randommaker(floatingspeed)*-1}if (thisspan.posTop<margintop) {thisspan.posTop+=Math.abs(stepy[i])stepy[i]=randommaker(floatingspeed)}}}if (ns4) {for (i=0;i<=numberofmessages;i++) { var thisspan=eval("document.span"+i)if (thisspan.left>marginright-boxwidth[i]-floatingspeed) {thisspan.left-=Math.abs(stepx[i]+1)stepx[i]=randommaker(floatingspeed)*-1}if (thisspan.left<marginleft) {thisspan.left+=Math.abs(stepx[i])stepx[i]=randommaker(floatingspeed)}if (thisspan.top>marginbottom-boxheight[i]-floatingspeed) {thisspan.top-=Math.abs(stepy[i])stepy[i]=randommaker(floatingspeed)*-1}if (thisspan.top<margintop) {thisspan.top+=Math.abs(stepy[i])stepy[i]=randommaker(floatingspeed)}}}if (ns6) {for (i=0;i<=numberofmessages;i++) { var thisspan=document.getElementById('span'+i).stylevar leftx=parseInt(thisspan.left)var topy=parseInt(thisspan.top)if (leftx>marginright-boxwidth[i]-floatingspeed) {thisspan.left=leftx-Math.abs(stepx[i]+1)stepx[i]=randommaker(floatingspeed)*-1}if (leftx<marginleft) {thisspan.left=leftx+Math.abs(stepx[i])stepx[i]=randommaker(floatingspeed)}if (topy>marginbottom-boxheight[i]-floatingspeed) {thisspan.top=topy-Math.abs(stepy[i])stepy[i]=randommaker(floatingspeed)*-1}if (topy<margintop) {thisspan.top=topy+Math.abs(stepy[i])stepy[i]=randommaker(floatingspeed)}}}}if (ie || ns6) {for (i=0;i<=numberofmessages;i++) { document.write("<span id='span"+i+"' style='position:absolute;top:0px;left:0px;filter:alpha(opacity=0);-moz-opacity:0;border-style:solid;border-color:"+textbordercolor+";border-width:"+textborder+"px;background-color:"+textbgcolor+";'></span>") document.close()}}if (ns4) {for (i=0;i<=numberofmessages;i++) { document.write("<layer name='span"+i+"' left=0 top=0>"+spancontent[i]+"</layer>") document.close()}}window.onload=setValues</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><div style="position:absolute;top:0px;left:0px;visibility:hidden">hide me</div><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->