Mega Code Archive

 
Categories / JavaScript DHTML / GUI Components
 

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 &lt;OBJECT&gt; tag with CLASSID as <br>"CLSID:333C7BC4-460F-11D0-BC04-0080C7055A83". To include such a ticker, you must first place the following &lt;STYLE&gt; and JavaScript in the &lt;HEAD&gt; 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 &lt;OBJECT&gt; 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)