TopXML JavaScript library : XML Ticker

Home Page

Add/Edit your code items

Search the code library

Browse for the code library

JavaScript
JavaScript
JavaScript Contents
Fading Ticker
How to understand the flow of control in XLST
Begginers, search the Bible
JavaScript Ticker (using Tabular Data Control)
-postfix.aspx>Infix <> Postfix
Nested Tables And Data Island
XML Data Traversal
TrimWhiteSpace
Two Tier Data Islands with Expanding/Collapsing Child elements.
Escape special characters using JavaScript and regular expressions
Sticky Table Headers
Dynamically Filling HTML Select Box from XML Data Island using Javascript.
XML Basics Handbook

LAMP >>

By	Premshree Pillai
First Posted	08/28/2002
Times viewed	188

XML Ticker

This post contains attachments
v20020828093234.zip

Summary XML based JavaScript Ticker that can tick any number of messages.

This is an XML based JavaScript Ticker that can tick any number of messages. The ticker works with IE only. The ticker reads it's contents, i.e the ticker style, text to be displayed, the link for that particular message from a XML file. (Here ticker_items.xml). The structure of the XML document is as follows Â» TICKER tickerstyle Â» pause = "true" / "false" :: "true" for pause onMouseOver Â» timeout = any integer :: The delay in seconds between different messages. Â» border = any integer :: Border width of Ticker Â» bordercolor = #HexColor :: The border color of Ticker Â» background = #HexColor :: Background color of Ticker Â» width = any integer :: Ticker width Â» height = any integer :: Ticker height tickerlinkstyle mouseout Â» font = "verdana,arial,helvetica....." :: Ticker link font Â» color = #HexColor :: Ticker link color Â» decoration = "none" / "underline" / "underline + overline" :: Ticker link style Â» weight = "normal" / "bold" :: Ticker link weight Â» size = 'any integer'pt :: Ticker link size mouseover Â» font = "verdana,arial,helvetica....." :: Ticker link font Â» color = #HexColor :: Ticker link color Â» decoration = "none" / "underline" / "underline + overline" :: Ticker link style Â» weight = "normal" / "bold" :: Ticker link weight Â» size = 'any integer'pt :: Ticker link size tickeritem Â» URL = A valid URL :: Ticker link URL Â» target = "_blank" / "_top" / "_self" / 'any other valid target name' :: Ticker link target

Additional information
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>XML Ticker</title> <style type="text/css"> .link{font-family:verdana,arial,helvetica; color:#003399; font-size:8pt; font-weight:bold} .link:hover{font-family:verdana,arial,helvetica; color:#CC0000; font-size:8pt; font-weight:bold} .link_xml{font-family:verdana,arial,helvetica; color:#003399; text-decoration:none; font-size:10pt; font-weight:bold} .link_xml:hover{font-family:verdana,arial,helvetica; color:#FF9900; text-decoration:none; font-size:10pt; font-weight:bold} </style> </head> <body bgcolor="#EFEFEF"> <table width="650" style="border:3 solid #000000; background:#FFFFFF" align="center"><tr><td> <center><span style="font-family:verdana,arial,helvetica; font-size:40pt; color:#808080; font-weight:bold">XML Ticker</span></center> <center>/n  <script language="JavaScript1.2"> // XML Ticker JavaScript // (c) 2002 Premshree Pillai // http://www.qiksearch.com // qiksearch@rediffmail.com var xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); function loadXML(xmlFile) { xmlDoc.async="false"; xmlDoc.onreadystatechange=verify; xmlDoc.load(xmlFile); ticker=xmlDoc.documentElement; } function verify() { if (xmlDoc.readyState != 4) { return false; } } loadXML('ticker_items.xml'); document.write('<style type="text\/css">'); document.write('.ticker_style{font-family:' + ticker.childNodes(1).childNodes(0).getAttribute('font') + '; font-size:' + ticker.childNodes(1).childNodes(0).getAttribute('size') + '; color:' + ticker.childNodes(1).childNodes(0).getAttribute('color') + '; font-weight:' + ticker.childNodes(1).childNodes(0).getAttribute('weight') + '; text-decoration:' + ticker.childNodes(1).childNodes(0).getAttribute('decoration') + '}'); document.write('.ticker_style:hover{font-family:' + ticker.childNodes(1).childNodes(1).getAttribute('font') + '; font-size:' + ticker.childNodes(1).childNodes(1).getAttribute('size') + '; color:' + ticker.childNodes(1).childNodes(1).getAttribute('color') + '; font-weight:' + ticker.childNodes(1).childNodes(1).getAttribute('weight') + '; text-decoration:' + ticker.childNodes(1).childNodes(1).getAttribute('decoration') + '}/n'); document.write('</style>'); document.write('<table style="border:' + ticker.childNodes(0).getAttribute('border') + ' solid ' + ticker.childNodes(0).getAttribute('bordercolor') + '; background:' + ticker.childNodes(0).getAttribute('background') + '; width:' + ticker.childNodes(0).getAttribute('width') + '; height:' + ticker.childNodes(0).getAttribute('height') + '"><tr><td><div id="ticker_space"></div></td></tr></table>'); var item_count=2; var timeOutVal=(ticker.childNodes(0).getAttribute('timeout'))*1000; var original_timeOutVal=timeOutVal; var isPauseContent; if(ticker.childNodes(0).getAttribute('pause')=="true") { isPauseContent=' onmouseover="setDelay();" onmouseout="reset();"'; } else { isPauseContent=''; } function setTicker() { document.all.ticker_space.innerHTML='<center><a href="' + ticker.childNodes(item_count).getAttribute('URL') + '" target="' + ticker.childNodes(item_count).getAttribute('target') + '" class="ticker_style"' + isPauseContent + '>' + ticker.childNodes(item_count).firstChild.text + '</a></center>'; if(item_count==ticker.childNodes.length-1) { item_count=2; } else { item_count++; } setTimeout("setTicker()",timeOutVal); } function setDelay() { timeOutVal=10000000000000; item_count--; } function reset() { timeOutVal=original_timeOutVal; setTicker(); } setTicker(); </script>  </center>/n <table width="600" align="center"><tr><td> <font face="verdana,arial,helvetica" size="-1" color="#000000"> This is an XML based JavaScript Ticker that can tick any number of messages. The ticker works with <b>IE only</b>. The ticker reads it's contents, i.e the ticker style, text to be displayed, the link for that particular message from a XML file. (Here <a href="ticker_items.xml" class="link_xml" target="_blank">ticker_items.xml</a>). The structure of the XML document is as follows » </font> </td></tr></table>/n <table align="center"><tr><td> <font face="verdana,arial,helvetica" size="-1" color="#000000"> <b>TICKER</b>/n <img src="section.gif" width="13" height="13"> tickerstyle/n <table cellspacing="0" cellpadding="0"><tr><td><table width="13" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » pause = "true" / "false" :: "true" for pause onMouseOver</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="13" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » timeout = any integer :: The delay in seconds between different messages.</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="13" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » border = any integer :: Border width of Ticker</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="13" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » bordercolor = #HexColor :: The border color of Ticker</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="13" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » background = #HexColor :: Background color of Ticker</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="13" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » width = any integer :: Ticker width</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="13" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » height = any integer :: Ticker height</font></td></tr></table> <img src="section.gif" width="13" height="13"> tickerlinkstyle/n <table cellspacing="0" cellpadding="0"><tr><td><table width="13" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#003399"> <img src="section.gif" width="13" height="13"> mouseout</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="26" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » font = "verdana,arial,helvetica....." :: Ticker link font</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="26" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » color = #HexColor :: Ticker link color</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="26" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » decoration = "none" / "underline" / "underline + overline" :: Ticker link style</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="26" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » weight = "normal" / "bold" :: Ticker link weight</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="26" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » size = 'any integer'pt :: Ticker link size</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="13" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#003399"> <img src="section.gif" width="13" height="13"> mouseover</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="26" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » font = "verdana,arial,helvetica....." :: Ticker link font</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="26" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » color = #HexColor :: Ticker link color</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="26" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » decoration = "none" / "underline" / "underline + overline" :: Ticker link style</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="26" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » weight = "normal" / "bold" :: Ticker link weight</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="26" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » size = 'any integer'pt :: Ticker link size</font></td></tr></table> <img src="section.gif" width="13" height="13"> tickeritem/n <table cellspacing="0" cellpadding="0"><tr><td><table width="13" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » URL = A valid URL :: Ticker link URL</font></td></tr></table> <table cellspacing="0" cellpadding="0"><tr><td><table width="13" cellspacing="0" cellpadding="0"><tr><td></td></tr></table></td><td><font face="verdana,arial,helvetica" size="-1" color="#CC0000"> » target = "_blank" / "_top" / "_self" / 'any other valid target name' :: Ticker link target</font></td></tr></table> </font> </td></tr></table> <hr color="#000000" style="height:1px"> <table width="100%"><tr><td><a href="http://www.qiksearch.com" class="link">© 2002 Premshree Pillai. All rights reserved.</td></tr></table> </td></tr></table> </body> </html>

Rate this article on a scale of 1 to 10 (0 votes, average 0)

Your vote :

LAMP >>


Leave a comment for this article
Your name
Your email (optional)
Your comment
Optional: Upload an attachment
Enter the code shown:



	Recent Jobs An immediate job opportunity as a Biztal Software Developers Needed in Charlotte, Sr. Software Engineer - Analytics Immediate Mainframe openings for Chennai Immediate TANDEM-TAL openings for Chenna View all Jobs (Add yours) View all CV (Add yours)

	answering service gotomeeting swimming pool contractor conference call water softener Teleconference Host Department NOLIMIT Web Hosting MSN sunglasses

	Partners Dream.In.Code dotNet Slackers dotNet Spider Your HTML Source VisualBuilder.com DevGuru Planet Source Code ZVON.ORG Web Design ASPAlliance XML Pitstop Scripts The Spot 4 SAP Bitshop Web Hosting

Email TopXML