Dynamic Drive DHTML Scripts- Ajax XML Ticker (txt file source)

Description: This is an Ajax enhanced ticker script that lets you use a text file as the contents of the ticker to show! Easily define your messages, which support rich HTML, all inside this external text file. Now there's no more excuse to not update the contents of your ticker more often! Note that due to Ajax limitations, the ticker script and text file to draw from need to be on the same domain/server.

As a side note, while we're labelling this script "XML ticker", technically, it's not XML, as the external file source is just a regular text file, not XML file. Since XML makes it cumbersome to include rich HTML inside it, we decided to go with a text file that's structured similar to XML instead.

The above references an external JavaScript file, which you should upload to your server:

Step 2: Then, to display a ticker instance on your page, paste the below sample code into the BODY of your page:

<script type="text/javascript">

var xmlfile="tickercontent.txt" //path to ticker txt file on your server.

//ajax_ticker(xmlfile, divId, divClass, delay, optionalfadeornot)
new ajax_ticker(xmlfile, "ajaxticker1", "someclass", 3500, "fade")
</script>

where "xmlfile" is an arbitrary variable that contains the path to the ticker content txt file on your server, in this case, "tickercontent.txt." If you wish to specify an absolute URL to the txt file on your server, you should use the syntax:

var xmlfile=="http://"+window.location.hostname+"/subdir/tickercontent.txt"

The "window.location" portion returns the root domain of your site dynamically. The root domain is dynamically constructed due to Ajax being finicky about its syntax (see Load Absolute URL for an explanation on this).

Function ajax_ticker() function is what you call to display a ticker instance on the page. Its parameters are pretty self explanatory:

where "divId" is an arbitrary but unique ID to be used for this ticker, "divClass", an arbitrary CSS class name for additional styling purposes. and "delay", the delay between message change in miliseconds. "optionalfadeornot" is an optional string that enables a fade in effect if defined. Enter "fade" to enable the effect, or remove it to disable it. You can call this function multiples to display more than one ticker on the page.

Syntax for "tickercontent.txt"

Finally, the syntax for "tickercontent.txt" is very simple- simply wrap each ticker message inside its own <div class="message"> tag. You're free to include HTML inside the message as well:

<div class="message">
<a href="http://www.javascriptkit.com" target="_new">JavaScript Kit</a><br />Comprehensive JavaScript tutorials and over 400+ free scripts!
</div>

<div class="message">
<a href="http://www.codingforums.com">Coding Forums 2</a><br />Web coding and development forums.
</div>

<div class="message">
<a href="http://www.cssdrive.com">CSS Drive</a><br />Categorized CSS gallery and examples.
</div>

And that's it! The script will load the above text file, and display each message accordingly.