
	ASP Shopping Cart, Forum & BBS - all for $20 from CodeToad Plus!

Home || ASP | ASP.Net | C++/C# | DHTML | HTML | Java | Javascript | Perl | VB | XML || CodeToad Plus! || Forums || RAM

Search Site:

Home » XML » Article

XML Ticker

Article by:

Premshree Pillai (8/6/2002)

	Add to Favourites
	Tell a friend

Summary:

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.

Viewed: 20671 times

Rating (6 votes):

5 out of 5

Rate this Article

Read Comments

Post Comments

XML Ticker

Online Demo
Download files

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

Here is the xml file:

and here is the javascript that loads the xml file in and displays the ticker (place this on your page between the body tags where you would like the ticker to display:

//XML Ticker script- By Premshree Pillai (premshree@hotmail.com)
//http://www.qiksearch.com/
//Visit http://www.codetoad.com for this script

var browserok=window.ActiveXObject
if (browserok)
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; 
 }
}

if (browserok){
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') + '}<br>');
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 setDelay()
{
 timeOutVal=10000000000000;
 item_count--;
}

function reset()
{
 timeOutVal=original_timeOutVal;
 setTicker();
}

if (browserok)
setTicker();

</script>

Online Demo
Download files

Useful Links

Fat Cow Hosting

FatCow Review

Advertise here

CodeToad Experts

Can't find the answer?
Our Site experts are answering questions for free in the CodeToad forums

Rate this article: Poor Excellent

View highlighted Comments

User Comments on 'XML Ticker'

Posted by : Archive Import (Roopa Hiremath) at 16:04 on Wednesday, August 21, 2002

This code was very helpful. But is there any other way to read the xml file without using the Microsoft.XMLDOM object. Because the above code will not work in Netscape browsers.

Posted by : Archive Import (John Scott) at 22:01 on Friday, January 03, 2003

You may want to check out the following tutorial for a cross browser technique to loading a XML file using JS: http://www.javascriptkit.com/dhtmltutors/getxml.shtml

To post comments you need to become a member. If you are already a member, please log in .

RELATED ARTICLES
XML and JavaScript Tutorial by Premshree Pillai This tutorial shows how we can use XML and client side JavaScript. We will see how we can display the contents of a XML file using JavaScript, accessing child elements, manipulating elements etc.

Display XML in tree format using Javascript by Premshree Pillai In this article, I present a XML based client-side JavaScript that reads data from an external XML file, traverses the XML data and displays the same in a tree format. I'll use the XMLDOM ActiveX object built into Microsoft Internet Explorer for the same.

Pulling Data from Other Web pages with XMLHTTP by Jeff Anderson Using the little known (as yet) XMLHTTP object, part of the XML DOM Model, you can pull data from other web pages for manipulation or your own purposes.

Using the XML Data Source Object by Premshree Pillai The XML Data Source Object (DSO) is a Microsoft ActiveX control built into Microsoft Internet Explorer 4+. Using this object, it is possible to extract content from an external XML file or XML data embedded in the HTML file into a HTML page. In this article, I'll explain how to include the XML DSO, extract content from an external XML file, extract XML data from XML data embedded in the webpage and manipulation using JavaScript

XML Converter for MySQL database by Rustem MySQL has no native facilities for dealing with XML. This does not mean we are left out of the XML evolution. RustemSoft XML Converter has ‘MySQL to XML’ support.

Creating An XML Newsfeed by Jeff Anderson A full explanation of how to take an XML newsfeed from moreover, amazon affiliates, google or any of the other current feed providers, and turn it into a display page using a little ASP.

XML Ticker using XML Data Source Object (DSO) by Premshree Pillai This news ticker shows an example of data binding using the XML DSO which is an ActiveX control built into Microsoft Internet Explorer.

Amazon Lite Web Service by kokogiak.com A complete XML web service allowing you to offer complete Amazon searches and disaply results on your site. A fantastic introduction to XML Web Services.

XML Ticker by Premshree Pillai 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.

Batch processing XML with XSLT 2.0 by Krunal Patel What you need is an XML version of the directory listing. Then, you could use that XML file as the single input file to XSLT and process each file using XSLT. It would be wonderful if you could do the directory processing in XSLT directly. Unfortunately, with all the power of XSLT -- and particularly XSLT 2.0 -- the language still doesn't have directory operations.

Recent Forum Threads

•	C++
•	Re: refresh parent after closing pop up window
•	Dynamic Insertion
•	Date and Time function around the world???
•	Significant Factors
•	Perl array access
•	Re: huffman encoding and decoding in C++...
•	Perl One Liner: Replace {(
•	Re: html including php, accessing the functions

Recent Articles

	ASP GetTempName
	Decode and Encode UTF-8
	ASP GetFile
	ASP FolderExists
	ASP FileExists
	ASP OpenTextFile
	ASP FilesystemObject
	ASP CreateFolder
	ASP CreateTextFile
	Javascript Get Selected Text

submit a link - privacy - contact - advertise - hot links - link to us - submit your article