Full version: jsB@nk » Scrollers » Horizontal scroller » Floating Christmas-Scroller with shadow-font and snowing-animation
URL: https://www.javascriptbank.com/floating-christmas-scroller-with-shadow-font-and-snowing-animation-index.html
Charming little XMAS-scroller with snowing-animation and eyecatching shadow-font. The CENTERED scroller sticks to its vertical position even if you scroll down your webpage. Add as many messages as you like. Each message can be linked to a different URL. Easy installation of messages, links, fontcolor, fontfamily, fontsize and vertical position.
Full version: jsB@nk » Scrollers » Horizontal scroller » Floating Christmas-Scroller with shadow-font and snowing-animation
URL: https://www.javascriptbank.com/floating-christmas-scroller-with-shadow-font-and-snowing-animation-index.html
<SCRIPT>// Floating Christmas-Scroller with shadow-font and snowing-animation// EDIT THE VARIABLES/VALUES BELOW:// messages. Add as many messages as you likevar message=new Array()message[0]="Merry Christmas, dear visitor!"message[1]="We hope to see you again next year."message[2]="Have a good time and enjoy life!"// links of the messages (you need to set up link for each message)var messageurl=new Array()messageurl[0]="http://JavaScriptBank.com"messageurl[1]="http://JavaScriptBank.com"messageurl[2]="http://JavaScriptBank.com"// targets of the links (you need to set up a target for each message)// accepted values are '_blank' or '_top' or '_parent' or '_self'// or the name of your target-window (for instance 'main')var messagetarget=new Array()messagetarget[0]="_blank"messagetarget[1]="_blank"messagetarget[2]="_blank"// color of the messagesvar textcolor="orange"// color of the message-shadowsvar textshadowcolor="blue"// speed 1: lower means fastervar pause=20// speed 2: higher means fastervar step=2// font-size of messagesvar fntsize=14// font-family of messagesvar fntfamily="Impact"// font-weight: 1 means bold, 0 means normalvar fntweight=0// backgroundcolor of scrollervar backgroundcolor="000000"// borderwidth of scroller (pixels)var borderwidth=2// scroller-distance from the top of your browser-window (pixels)var topdistance=220//**********************************************************************************// DO NOT EDIT ANYTHING BELOW THIS LINE!!!!var snowani=new Array("snowani0.gif", "snowani1.gif", "snowani2.gif")var snowani0=new Image()snowani0.src="snowani0.gif"var snowani1=new Image()snowani1.src="snowani1.gif"var snowani2=new Image()snowani2.src="snowani2.gif"var cellpad=10var scrollerwidth=220var scrollerheight=30var shadowsize=1var scrollerleftvar scrollertopvar screenwidthvar clipleft,clipright,cliptop,clipbottomvar i_message=0var i_snowani=0var timervar textwidthvar textcontent=""var textshadowcontent=""var bgcontent=""if (fntweight==1) {fntweight="bold"}else {fntweight="normald"}topdistance=topdistance+cellpadfunction doanimation() {if (i_snowani>=3) {i_snowani=0}if (document.all) {bgcontent="<img src='"+snowani[i_snowani]+"'>"bgscroller.innerHTML=bgcontent}if (document.layers) {document.bgscroller.document.snowpic.src=snowani[i_snowani]}i_snowani++var animation_timer=setTimeout("doanimation()",200)}function init() {doanimation()gettextcontent()if (document.all) {gettextshadowcontent()} if (document.all) {screenwidth=document.body.clientWidthscrollertop=document.body.scrollTopscrollerleft=screenwidth/2-scrollerwidth/2text.innerHTML=textcontenttextshadow.innerHTML=textshadowcontenttextwidth=text.offsetWidthdocument.all.bgscroller.style.posTop=scrollertop-cellpad+topdistance document.all.bgscroller.style.posLeft=scrollerleft-cellpaddocument.all.text.style.posTop=scrollertop+topdistance document.all.text.style.posLeft=scrollerleft+scrollerwidthdocument.all.textshadow.style.posTop=scrollertop+shadowsize+topdistance document.all.textshadow.style.posLeft=scrollerleft+scrollerwidth+shadowsizeclipleft=0clipright=0cliptop=0clipbottom=scrollerheightdocument.all.text.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"document.all.textshadow.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")" scrolltext() }if (document.layers) {screenwidth=window.innerWidthscrollertop=pageYOffsetscrollerleft=screenwidth/2-scrollerwidth/2document.text.document.write(textcontent)document.text.document.close()textwidth=document.text.document.widthdocument.bgscroller.top=scrollertop-cellpad+topdistance document.bgscroller.left=scrollerleft-cellpaddocument.text.top=scrollertop+topdistancedocument.text.left=scrollerleft+scrollerwidthdocument.text.clip.left=0document.text.clip.right=0document.text.clip.top=0document.text.clip.bottom=scrollerheight scrolltext() }}function scrolltext() { if (document.all) {if (document.all.text.style.posLeft>=scrollerleft-textwidth) {document.all.text.style.posLeft-=stepdocument.all.textshadow.style.posLeft=document.all.text.style.posLeft+shadowsizeclipright+=stepif (clipright>scrollerwidth) {clipleft+=step}scrollertop=document.body.scrollTopdocument.all.text.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"document.all.textshadow.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"document.all.bgscroller.style.posTop=scrollertop-cellpad+topdistancedocument.all.text.style.posTop=scrollertop+topdistancedocument.all.textshadow.style.posTop=scrollertop+shadowsize+topdistancevar timer=setTimeout("scrolltext()",pause)}else {changetext()}} if (document.layers) {if (document.text.left>=scrollerleft-textwidth) {document.text.left-=stepdocument.text.clip.right+=stepif (document.text.clip.right>scrollerwidth) {document.text.clip.left+=step}scrollertop=pageYOffsetdocument.bgscroller.top=scrollertop-cellpad+topdistancedocument.text.top=scrollertop+topdistancevar timer=setTimeout("scrolltext()",pause)}else {changetext()}}}function changetext() { i_message++if (i_message>message.length-1) {i_message=0}gettextcontent()if (document.all) {gettextshadowcontent()}if (document.all) {text.innerHTML=textcontenttextshadow.innerHTML=textshadowcontenttextwidth=text.offsetWidth document.all.text.style.posLeft=scrollerleft+scrollerwidthdocument.all.textshadow.style.posLeft=scrollerleft+scrollerwidth+shadowsizeclipleft=0clipright=0document.all.text.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"document.all.textshadow.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")" scrolltext()}if (document.layers) { document.text.document.write(textcontent)document.text.document.close()textwidth=document.text.document.widthdocument.text.left=scrollerleft+scrollerwidthdocument.text.clip.left=0document.text.clip.right=0 scrolltext()}}function gettextcontent() {textcontent="<span style='position:relative;font-size:"+fntsize+"pt;font-family:"+fntfamily+";font-weight:"+fntweight+"'>"textcontent+="<a href="+messageurl[i_message]+" target="+messagetarget[i_message]+">"textcontent+="<nobr><font color="+textcolor+">"+message[i_message]+"</font></nobr></a></span>"}function gettextshadowcontent() {textshadowcontent="<span style='position:relative;font-size:"+fntsize+"pt;font-family:"+fntfamily+";font-weight:"+fntweight+"'>"textshadowcontent+="<a href="+messageurl[i_message]+" target="+messagetarget[i_message]+">"textshadowcontent+="<nobr><font color="+textshadowcolor+">"+message[i_message]+"</font></nobr></a></span>"}window.onresize=init;window.onload=init;</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><DIV ID="bgscroller" style="position:absolute;"> <img name="snowpic" src="snowani0.gif" width="240" height="40"></DIV><DIV ID="textshadow" style="position:absolute;"></DIV><DIV ID="text" style="position:absolute;"></DIV><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->