Full version: jsB@nk » Scrollers » Horizontal scroller » Right-To-Left-Scroller with fade-effect
URL: https://www.javascriptbank.com/right-to-left-scroller-with-fade-effect.html
Add as many messages as you like. Each message can be linked to a different URL. Special feature: Each message has a fontcolor of its own. Easy installation of messages, scrollersize, positioning and font-attributes (such as fontcolor, fontfamily, fontsize, fontweight and more).
Full version: jsB@nk » Scrollers » Horizontal scroller » Right-To-Left-Scroller with fade-effect
URL: https://www.javascriptbank.com/right-to-left-scroller-with-fade-effect.html
<SCRIPT language=JavaScript><!-- Beginning of JavaScript -// Right-To-Left-Scroller width fade-effect// Edit the variables below:// Your messages. Add as many as you likevar message=new Array()message[0]="JavaScriptBank.com"message[1]="Bank of over 2000+ free JavaScripts"// the URLs of your messagesvar messageurl=new Array()messageurl[0]="http://JavaScriptBank.com"messageurl[1]="http://JavaScriptBank.com"// the targets of the links// 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"// font-colorvar messagecolor= new Array()messagecolor[0]="red"messagecolor[1]="blue"messagecolor[2]="black"// distance of the scroller to the left margin of the browser-window (pixels)var scrollerleft=20// distance of the scroller to the top margin of the browser-window (pixels)var scrollertop=20// width of the scroller (pixels)var scrollerwidth=300// height of the scroller (pixels)var scrollerheight=50// speed 1: lower means fastervar pause=20// speed 2: higher means fastervar step=2// font-sizevar fntsize=20// font-familyvar fntfamily="Arial"// font-weight: 1 means bold, 0 means normalvar fntweight=1// do not edit the variables belowvar fadeimgwidth=60var fadeimgleftcontent,fadeimgrightcontentvar clipleft,clipright,cliptop,clipbottomvar i_message=0var timervar textwidthvar textcontent=""if (fntweight==1) {fntweight="700"}else {fntweight="100"}function init() {gettextcontent()fadeimgleftcontent="<img src='fadeimgleft.gif' width="+fadeimgwidth+" height="+scrollerheight+">"fadeimgrightcontent="<img src='fadeimgright.gif' width="+fadeimgwidth+" height="+scrollerheight+">" if (document.all) {text.innerHTML=textcontentfadeimgleft.innerHTML=fadeimgleftcontentfadeimgright.innerHTML=fadeimgrightcontenttextwidth=text.offsetWidthdocument.all.text.style.posTop=scrollertop document.all.text.style.posLeft=scrollerleft+scrollerwidthdocument.all.fadeimgleft.style.posTop=scrollertop document.all.fadeimgleft.style.posLeft=scrollerleftdocument.all.fadeimgright.style.posTop=scrollertop document.all.fadeimgright.style.posLeft=scrollerleft+scrollerwidth-fadeimgwidthclipleft=0clipright=0cliptop=0clipbottom=scrollerheightdocument.all.text.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")" scrolltext() }if (document.layers) {document.text.document.write(textcontent)document.text.document.close()document.fadeimgleft.document.write(fadeimgleftcontent)document.fadeimgleft.document.close()document.fadeimgright.document.write(fadeimgrightcontent)document.fadeimgright.document.close()textwidth=document.text.document.widthdocument.text.top=scrollertopdocument.text.left=scrollerleft+scrollerwidthdocument.fadeimgleft.top=scrollertop document.fadeimgleft.left=scrollerleftdocument.fadeimgright.top=scrollertop document.fadeimgright.left=scrollerleft+scrollerwidth-fadeimgwidthdocument.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-=stepclipright+=stepif (clipright>scrollerwidth) {clipleft+=step}document.all.text.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"var 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}var timer=setTimeout("scrolltext()",pause)}else {changetext()}}}function changetext() { i_message++if (i_message>message.length-1) {i_message=0}gettextcontent()if (document.all) {text.innerHTML=textcontenttextwidth=text.offsetWidth document.all.text.style.posLeft=scrollerleft+scrollerwidthclipleft=0clipright=0document.all.text.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="+messagecolor[i_message]+">"+message[i_message]+"</font></nobr></a></span>"}window.onresize=init;// - 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=init()><DIV id=text style="LEFT: -2000px; POSITION: absolute"></DIV><DIV id=fadeimgleft style="LEFT: -2000px; POSITION: absolute"> <IMG src="fadeimgleft.gif" width="60" height="30"></DIV><DIV id=fadeimgright style="LEFT: -2000px; POSITION: absolute"> <IMG src="fadeimgright.gif" width="60" height="30"></DIV></BODY><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
http://javascriptbank.com/javascript/scroller/fadeimgleft.gifhttp://javascriptbank.com/javascript/scroller/fadeimgright.gif