»
EnglishFrenchVietnamese

Print - Simple DHTML-ticker with unique last-letter-animation - JavaScriptBank.com

Full version: jsB@nk » Form » Simple DHTML-ticker with unique last-letter-animation
URL: https://www.javascriptbank.com/simple-dhtml-ticker-with-unique-last-letter-animation.html

Simple DHTML-ticker with unique last-letter-animation © JavaScriptBank.comSimple DHTML-ticker with cool last-letter-animation. Add as many messages as you like. Each message can be linked to a different URL. Easy configuration of messages, tickersize, tickerposition, speed and font-attributes (such as fontcolor, fontfamily, fontsize, fontweight and more). CROSSBROWSER (works smoother with Internet Explorer).

Full version: jsB@nk » Form » Simple DHTML-ticker with unique last-letter-animation
URL: https://www.javascriptbank.com/simple-dhtml-ticker-with-unique-last-letter-animation.html



JavaScript
<SCRIPT language=javaScript><!-- Beginning of JavaScript -// Simple DHTML-ticker with last-letter-animation// Configure your messages. You may add as many messages as you like.var message=new Array()message[0]="JavaScriptBank.com - Bank of over 2000+ free JavaScript"// set a link for each meassagevar messagelink=new Array()messagelink[0]="http://JavaScriptBank.com"// set a target for each messagelink. Accepted values: '_blank', '_top',// '_parent', '_self' or the name of your framesetvar linktarget=new Array()linktarget[0]="_blank"linktarget[1]="_blank"linktarget[2]="_blank"// horizontal position of the ticker// (distance to the left margin of the browser-window, pixels)var leftposition=10// vertical position of position of the ticker // (distance to the top margin of the browser-window, pixels)var topposition=10// width of the tickervar tickerwidth=180// height of the tickervar tickerheight=200// distance from the messagetext to the tickermarrgin (pixels)var tickerpadding=10// borderwidth of the ticker (pixels)var borderwidth=1// font-familyvar fnt="Verdana"// font-size of the textvar fntsize=9// font-size of the last letter of the tickervar fntsizelastletter=10// font-color of the textvar fntcolor="FFFF00"// font-color of the last letter of the tickervar fntcolorlastletter="red"// font-weight. Set a value between 1 to 9 to adjust the boldnessvar fntweight=4// backgroundcolorvar backgroundcolor="black"// standstill between the messages (microseconds)var standstill=2000// speed (a higher value will slow down the ticker)var speed=40// Do not edit the variables belowvar i_substring=0var i_presubstring=0var i_message=0var messagecontent=""var messagebackground=""var messagepresubstring=""var messageaftersubstring=""fntweight=fntweight*100function initiateticker() {getmessagebackground()if (document.all) {document.all.ticker.style.posLeft=leftpositiondocument.all.ticker.style.posTop=toppositiondocument.all.tickerbg.style.posLeft=leftpositiondocument.all.tickerbg.style.posTop=toppositiontickerbg.innerHTML=messagebackgroundshowticker()}if (document.layers) {document.tickerbg.document.write(messagebackground)document.tickerbg.document.close()document.ticker.left=leftpositiondocument.ticker.top=toppositiondocument.tickerbg.left=leftpositiondocument.tickerbg.top=toppositionshowticker()}}function getmessagebackground() {messagebackground="<table border="+borderwidth+" width="+tickerwidth+" height="+tickerheight+"><tr><td valign=top bgcolor='"+backgroundcolor+"'>"messagebackground+="hello</td></tr></table>"}function getmessagecontent() {messagepresubstring=message[i_message].substring(0,i_presubstring)messageaftersubstring=message[i_message].substring(i_presubstring,i_substring)messagecontent="<table border=0 cellpadding="+tickerpadding+" width="+tickerwidth+" height="+tickerheight+"><tr><td valign=top>"messagecontent+="<span style='position:relative; font-family:"+fnt+";color:"+fntcolor+";font-size:"+fntsize+"pt;font-weight:"+fntweight+"'>"messagecontent+="<a href='"+messagelink[i_message]+"' target='"+linktarget[i_message]+"'>"messagecontent+="<font color='"+fntcolor+"'>"messagecontent+=messagepresubstringmessagecontent+="</font>"messagecontent+="</a>"messagecontent+="</span>"messagecontent+="<span style='position:relative; font-family:"+fnt+";color:"+fntcolor+";font-size:"+fntsizelastletter+"pt;font-weight:900'>"messagecontent+="<a href='"+messagelink[i_message]+"' target='"+linktarget[i_message]+"'>"messagecontent+="<font color='"+fntcolor+"'>"messagecontent+=messageaftersubstringmessagecontent+="</font>"messagecontent+="</a>"messagecontent+="</span>"messagecontent+="</td></tr></table>"}function showticker() {if (i_substring<=message[i_message].length-1) {i_substring++i_presubstring=i_substring-1if (i_presubstring<0) {i_presubstring00}getmessagecontent()if (document.all) {ticker.innerHTML=messagecontentvar timer=setTimeout("showticker()", speed)}if (document.layers) {document.ticker.document.write(messagecontent)document.ticker.document.close()var timer=setTimeout("showticker()", speed)}}else {clearTimeout(timer)var timer=setTimeout("changemessage()", standstill)}}function changemessage() {i_substring=0i_presubstring=0i_message++if (i_message>message.length-1) {i_message=0}showticker()}// - End of JavaScript - --></SCRIPT><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<BODY onload=initiateticker()><DIV id=tickerbg style="POSITION: absolute"></DIV><DIV id=ticker style="POSITION: absolute"></DIV></BODY><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->