»
EnglishFrenchVietnamese

Print - UpNews Scroller-Simple and highly configurable - JavaScriptBank.com

Full version: jsB@nk » Scrollers » Vertical scroller » UpNews Scroller-Simple and highly configurable
URL: http://www.javascriptbank.com/upnews-scroller-simple-and-highly-configurable.html

UpNews Scroller-Simple and highly configurable © JavaScriptBank.comUpNews scrolls your messages from bottom to top pausing between each message. Each message contains a linkable title and short copy text. Configure all elements without programming-knowledge at the head of the script: font-family, font-size, font-color, background-color, borderwidth, scrollerwidth, scrollerheight, pause between the messages and so on. CROSSBROWSER.

Full version: jsB@nk » Scrollers » Vertical scroller » UpNews Scroller-Simple and highly configurable
URL: http://www.javascriptbank.com/upnews-scroller-simple-and-highly-configurable.html



CSS
<STYLE>A {COLOR: #aa0000}A:hover {COLOR: #ff0000}</STYLE><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<SCRIPT language=JavaScript1.2>// Simple UpNews Scroller// INSTALLATION:// 1.Delete the DIV-container with the id 'deletethisdiv'. //This is the only part of this file that is not required for the script. //Save the file.// 2.Configure the messages. Let's take a look at the first message to understand //its principle: //- 'Madonna Storms UK Charts' is the title. Then follows a '|'. //-Then follows the copytext 'Girl band All Saints were knocked off //the top spot in the British charts on Sunday by the queen of girl //power herself.' //-Then again follows a '|'. //As you see the '|' acts as delimiter between title, copytext and link! // 3.Configure the variables below:var message= new Array()// Please read section 2 above on how the messages have to be configured.// You may add as many messages as you like!message[0]="Free web clipart|All about web clipart from ABOUT.COM: great collections, clever creation tricks, tutorials, best of the net award, free tools and much more.|http://service.bfast.com/bfast/click?bfmid=7279965&siteid=30125004&bfpage=webclipart3"message[1]="Free Password Manager|Tired of remembering all your passwords? Download GATOR the best password manager and never fill in another webform again.|http://service.bfast.com/bfast/click?bfmid=1307357&siteid=30259592&bfpage=1"message[2]="Ask Jeeves|Have a question? JEEVES has the best answers! Just type it in and Jeeves will help you.|http://service.bfast.com/bfast/click?bfmid=1836462&siteid=29893256&bfpage=askme"// The height of the scrollerbox (pixels)var scrollerheight=140// The width of the scrollerbox (pixels)var scrollerwidth=160// The distance to the left border of the window (pixels)var scrollertop=20// The distance to the top border of the window (pixels)var scrollerleft=20// The padding between the scrollerbox and the text (pixels)var scrollerpadding=10// The width of the scrollerbox-border (pixels)var backgroundborder=2// The background-colour of the scrollerboxvar scrollerbgcolor="DDDDDD"// Font attributes of the titlevar font_titleface="Verdana"var font_titlecolor="FF0000"var font_titlesize=1// Font attributes of the copytextvar font_copyface="Verdana"var font_copycolor="660000"var font_copysize=1// standstill between the messages (milliseconds)var standstillfix=3000// Do not edit below this linevar cliptop=0var clipbottom=scrollerheight-2*scrollerpaddingvar clipleft=0var clipright=scrollerwidthvar i_message=0var mes_joinedvar mes_splitvar contenttextvar contentbgvar totalheight=scrollerheight*(message.length)var i_height=0var step=1var pause=20var standstillflex=0function initiate(){contenttext="<table cellpadding=0 cellspacing=0 border=0 width="+(scrollerwidth-2*scrollerpadding)+">"contenttext+="<tr valign='top'><td height='"+scrollerheight+"'><br></td></tr>"for (i=0;i<=message.length-1;i++) {mes_joined=message[i]mes_split=mes_joined.split("|")contenttext+="<tr valign='top'><td height='"+scrollerheight+"'><a href='"+mes_split[2]+"' target='_blank'><font face='"+font_titleface+"' color='"+font_titlecolor+"' size='"+font_titlesize+"'>"+mes_split[0]+"</font></a><br><font face='"+font_copyface+"' color='"+font_copycolor+"' size='"+font_copysize+"'>"+mes_split[1]+"</font></td></tr>"}contenttext+="</table>"contentbg="<table cellpadding=0 cellspacing=0 border="+backgroundborder+" width='"+scrollerwidth+"'><tr><td height='"+scrollerheight+"' bgcolor="+scrollerbgcolor+">&nbsp;</td></tr></table>"if (document.all) {scrollertext.innerHTML=contenttextscrollerbg.innerHTML=contentbgdocument.all.scrollertext.style.posTop=scrollertopdocument.all.scrollertext.style.posLeft=scrollerleftdocument.all.scrollerbg.style.posTop=scrollertop-scrollerpaddingdocument.all.scrollerbg.style.posLeft=scrollerleft-scrollerpaddingdocument.all.scrollertext.style.clip="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"}if (document.layers) {document.scrollertext.document.write(contenttext)document.scrollertext.document.close()document.scrollerbg.document.write(contentbg)document.scrollerbg.document.close()document.scrollertext.top=scrollertopdocument.scrollertext.left=scrollerleftdocument.scrollerbg.top=scrollertop-scrollerpaddingdocument.scrollerbg.left=scrollerleft-scrollerpaddingdocument.scrollertext.clip.left=clipleft        document.scrollertext.clip.right=clipright        document.scrollertext.clip.top=cliptop        document.scrollertext.clip.bottom=clipbottom}scroll()}function scroll(){standstillflex=standstillfixif (document.all){if (i_height<scrollerheight) {i_height+=stepcliptop+=stepclipbottom+=stepdocument.all.scrollertext.style.clip="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"document.all.scrollertext.style.posTop-=stepvar timer=setTimeout("scroll()",pause)}else {if (document.all.scrollertext.style.posTop<=-(totalheight)) {document.all.scrollertext.style.posTop=scrollertopcliptop=0clipbottom=scrollerheight-2*scrollerpaddingdocument.all.scrollertext.style.clip="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"standstillflex=0}i_height=0clearTimeout(timer)var timer=setTimeout("scroll()",standstillflex)}}if (document.layers){if (i_height<scrollerheight) {i_height+=stepcliptop+=stepclipbottom+=stepdocument.scrollertext.clip.left=clipleft        document.scrollertext.clip.right=clipright        document.scrollertext.clip.top=cliptop        document.scrollertext.clip.bottom=clipbottomdocument.scrollertext.top-=stepvar timer=setTimeout("scroll()",pause)}else {if (document.scrollertext.top<=-(totalheight)) {document.scrollertext.top=scrollertopcliptop=0clipbottom=scrollerheight-2*scrollerpaddingdocument.scrollertext.clip.left=clipleft        document.scrollertext.clip.right=clipright        document.scrollertext.clip.top=cliptop        document.scrollertext.clip.bottom=clipbottomstandstillflex=0}i_height=0clearTimeout(timer)var timer=setTimeout("scroll()",standstillflex)}}}</SCRIPT><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<BODY onload=initiate()><DIV id=scrollerbg style="POSITION: absolute; TOP: -1000px"></DIV><DIV id=scrollertext style="POSITION: absolute; TOP: -1000px"></DIV></BODY><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->