JavaScript Ticker using Tabular Data Control
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>JavaScript Ticker (using Tabular Data Control)</title>
<!-- BEGIN TICKER STYLE -->
<style type="text/css">
.tickerStyle{font-family:verdana,arial,helvetica; color:#666699; font-weight:bold; font-size:8pt; background:#EEEEFF; border-right:#666699 solid 2px; border-left:#666699 solid 1px; border-top:#666699 solid 1px; border-bottom:#666699 solid 2px; padding:3px; width:400px; text-align:center; text-decoration:none}
.tickerStyle:hover{font-family:verdana,arial,helvetica; color:#666699; font-weight:bold; font-size:8pt; background:#DDDDEE; border-right:#666699 solid 1px; border-left:#666699 solid 2px; border-top:#666699 solid 2px; border-bottom:#666699 solid 1px; padding:3px; width:400px; text-align:center; text-decoration:none}
</style>
<!-- END TICKER STYLE -->
<!-- BEGIN JAVASCRIPT TICKER USING TABULAR DATA CONTROL -->
<script language="JavaScript">
// JavaScript Ticker
// - using Tabular Data Control
// (c) 2002 Premshree Pillai
// http://www.qiksearch.com
// qiksearch@rediffmail.com
function TDC_Ticker(objName, divName, counter, maxMsgs, timeOut)
{
try
{
eval('tickerSet=' + objName + '.recordset');
if(!tickerSet.EOF && counter<maxMsgs-1)
{
tickerSet.MoveNext();
counter++;
}
else
{
counter=0;
tickerSet.MoveFirst();
}
setTimeout("TDC_Ticker('"+objName+"','"+divName+"','"+counter+"','"+maxMsgs+"','"+timeOut+"')", timeOut);
}
catch(e)
{
alert('This Ticker works with IE 5+ only.');
}
}
</script>
<!-- END JAVASCRIPT TICKER USING TABULAR DATA CONTROL -->
</head>
<body bgcolor="#FFFFFF">
<center><span style="font-family:verdana,arial,helvetica; font-weight:bold; font-size:19pt; color:#666699; filter:Shadow(direction=45, color=#9999CC); width:100%">JavaScript Ticker<br>using Tabular Data Control</span></center><br>
<!-- BEGIN TICKER PLACEMENT -->
<center>
<object id="ticker" classid="CLSID:333C7BC4-460F-11D0-BC04-0080C7055A83">
<param name="DataURL" value="tickerData.txt">
<param name="UseHeader" value="TRUE">
<param name="TextQualifier" value="~">
<param name="FieldDelim" value="|">
</object>
<a href="" datasrc="#ticker" datafld="messageURL" class="tickerStyle">
<span id="tickerDiv" datasrc="#ticker" datafld="message"></span>
</a>
<script language="JavaScript">
var tickerMaxMsgs=4; // Maximum Messages in the Data File
var tickerCount=tickerMaxMsgs;
new TDC_Ticker('ticker','tickerDiv',tickerCount,tickerMaxMsgs,2000); // Set the Ticker
</script>
</center>
<!-- END TICKER PLACEMENT -->
<!-- BEGIN DESCRIPTION -->
<table width="400" align="center" cellspacing="0" cellpadding="0"><tr><td>
<font face="verdana,arial,helvetica" size="-1" color="#000000">
<br>This JavaScript Ticker is an example of "Data Binding" using "Tabular Data Control (TDC)" which is a Microsoft ActiveX control built in to Internet Explorer.<br><br>
To include this ActiveX control, you must use the <OBJECT> tag with CLASSID as <br>"CLSID:333C7BC4-460F-11D0-BC04-0080C7055A83". To include such a ticker, you must first place the following <STYLE> and JavaScript in the <HEAD> section :<br><br>
<textarea rows="5" cols="45" style="border:#000000 solid 1px; overflow:auto" onfocus="this.select()">
<!-- BEGIN TICKER STYLE -->
<style type="text/css">
.tickerStyle{font-family:verdana,arial,helvetica; color:#666699; font-weight:bold; font-size:8pt; background:#EEEEFF; border-right:#666699 solid 2px; border-left:#666699 solid 1px; border-top:#666699 solid 1px; border-bottom:#666699 solid 2px; padding:3px; width:400px; text-align:center; text-decoration:none}
.tickerStyle:hover{font-family:verdana,arial,helvetica; color:#666699; font-weight:bold; font-size:8pt; background:#DDDDEE; border-right:#666699 solid 1px; border-left:#666699 solid 2px; border-top:#666699 solid 2px; border-bottom:#666699 solid 1px; padding:3px; width:400px; text-align:center; text-decoration:none}
</style>
<!-- END TICKER STYLE -->
<!-- BEGIN JAVASCRIPT TICKER USING TABULAR DATA CONTROL -->
<script language="JavaScript">
// JavaScript Ticker
// - using Tabular Data Control
// (c) 2002 Premshree Pillai
// http://www.qiksearch.com
// qiksearch@rediffmail.com
function TDC_Ticker(objName, divName, counter, maxMsgs, timeOut)
{
try
{
eval('tickerSet=' + objName + '.recordset');
if(!tickerSet.EOF && counter<maxMsgs-1)
{
tickerSet.MoveNext();
counter++;
}
else
{
counter=0;
tickerSet.MoveFirst();
}
setTimeout("TDC_Ticker('"+objName+"','"+divName+"','"+counter+"','"+maxMsgs+"','"+timeOut+"')", timeOut);
}
catch(e)
{
alert('This Ticker works with IE 5+ only.');
}
}
</script>
<!-- END JAVASCRIPT TICKER USING TABULAR DATA CONTROL --></textarea>
<br><br>Here is the description of the arguments that the function TDC_Ticker() takes:
<br><br><b>objName</b> : The ID of the OBJECT where you include the TDC for that ticker.
<br><b>divName</b> : The ID of the element where the messages will tick.
<br><b>counter</b> : A counter that should be initialised to the max number of messages.
<br><b>maxMsgs</b> : The max number of messages in the data file.
<br><b>timeOut</b> : The delay (in milliseconds) between messages.
<br><br>Next, you must place the code for placing the ticker. For e.g, the code for placing the above ticker is :<br><br>
<textarea rows="5" cols="45" style="border:#000000 solid 1px; overflow:auto" onfocus="this.select()">
<!-- BEGIN TICKER PLACEMENT -->
<center>
<object id="ticker" classid="CLSID:333C7BC4-460F-11D0-BC04-0080C7055A83">
<param name="DataURL" value="tickerData.txt">
<param name="UseHeader" value="TRUE">
<param name="TextQualifier" value="~">
<param name="FieldDelim" value="|">
</object>
<a href="" datasrc="#ticker" datafld="messageURL" class="tickerStyle">
<span id="tickerDiv" datasrc="#ticker" datafld="message"></span>
</a>
<script language="JavaScript">
var tickerMaxMsgs=4; // Maximum Messages in the Data File
var tickerCount=tickerMaxMsgs;
new TDC_Ticker('ticker','tickerDiv',tickerCount,tickerMaxMsgs,2000); // Set the Ticker
</script>
</center>
<!-- END TICKER PLACEMENT --></textarea>
<br><br>Here is the list of Parameters the <OBJECT> takes :
<br><br><b>DataURL</b> : The path of the file that contains the data.
<br><b>UseHeader</b> : This is always set to TRUE.
<br><b>TextQualifier</b> : The character at the beginning and end of a message.
<br><b>FieldDelim</b> : The Field Delimiter.<br><br>
<a href="tickerData.txt" target="_blank"><font color="#666699">Click here</font></a> to see the data file (tickerData.txt) used for the above ticker.<br><br>
</font>
</td></tr></table>
<!-- END DESCRIPTION -->
<!-- BEGIN TICKER PLACEMENT FOR CPY -->
<center>
<object id="cpy" classid="CLSID:333C7BC4-460F-11D0-BC04-0080C7055A83">
<param name="DataURL" value="cpyData.txt">
<param name="UseHeader" value="TRUE">
<param name="TextQualifier" value="*">
<param name="FieldDelim" value="^">
</object>
<a href="" datasrc="#cpy" datafld="messageURL" class="tickerStyle">
<span id="cpyDiv" datasrc="#cpy" datafld="message"></span>
</a>
<script language="JavaScript">
var cpyMaxMsgs=2; // Maximum Messages in the Data File
var cpyCount=cpyMaxMsgs;
new TDC_Ticker('cpy','cpyDiv',cpyCount,cpyMaxMsgs,4000); // Set the Ticker
</script>
</center>
<!-- END TICKER PLACEMENT FOR CPY -->
<table width="400" align="center"><tr><td><script language="JavaScript">document.write('<font face="verdana,arial,helvetica" size="-2" color="#CCCCCC">' + document.lastModified + '</font>');</script></td></tr></table>
</body>
</html>
ticker_tdc.zip( 2 k)Related examples in the same category