JavaScript DHTML/GUI Components/Ticker — различия между версиями
Admin (обсуждение | вклад) м (1 версия) |
|
(нет различий)
| |
Текущая версия на 07:22, 26 мая 2010
Содержание
Button Ticker
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Button Ticker</title>
<style type="text/css">
.link{font-family:verdana,arial,helvetica; font-size:8pt; color:#3366CC; font-weight:normal}
.link:hover{font-family:verdana,arial,helvetica; font-size:8pt; color:#0099FF; font-weight:normal}
.header{font-family:arial,verdana,helvetica; font-size:20pt; color:#3366CC; font-weight:bold}
</style>
</head>
<body bgcolor="#FFFFFF">
<center>
<span class="header">Button Ticker</span>
<br>
<script language="javascript">
//**************************************************
// Button Ticker *
// Date created : 19 Feb, 2002 *
// (c) 2002 Premshree Pillai. All rights reserved. *
// http://www.qiksearch.ru *
// premshree@hotmail.ru *
// Visit http://www.qiksearch.ru/javascripts.htm *
// for FREE scripts *
// Use freely as long as this message is intact *
//**************************************************
// Location : http://www.qiksearch.ru/javascripts/button-ticker.htm
count=0;
var inv_button_flag=0;
if (navigator.appName=="Microsoft Internet Explorer" || (navigator.appName=="Netscape" && navigator.appVersion >= "5"))
{
document.write("<form name="qiksearch_ticker"><input type="button" name="qiksearch_ticker" onclick="goURL();" style="background:#FFFFFF; width:377; height:22; border-width:1; border-color:#000000; cursor:hand" onmouseover="this.style.background='#BDDCFF';return true" onmouseout="this.style.background='#FFFFFF';return true" onmousedown="this.style.background='#FFD543';return true"><input type="button" value="5" onclick="javascript:inv_button();inv_msg();inv_URL();" style="width:22; height:22; font-family:webdings; background:#FFFFFF; border-left-width:0; border-right-width:1px; border-top-width:1px; border-bottom-width:1px; border-color:#000000; cursor:hand" name="inv_but" title="Tick Up Direction"></form>");
}
else
{
document.write("<form name="qiksearch_ticker"><input type="button" name="qiksearch_ticker" onclick="goURL();" width="349" border="0"><input type="button" width="50" value="up" onclick="javascript:inv_button();inv_msg();inv_URL();" name="inv_but"></form>");
}
var ticker_speed=1;
// Ticker messages
var ticker_msg = new Array(
"Welcome to Qiksearch",
"FREE Javascripts",
"Intellisearch Bar NOW!",
"www.qiksearch.ru",
"FREE Articles" ); // No comma after last ticker msg
// Ticker URLs
var ticker_url = new Array(
"http://www.qiksearch.ru",
"http://www.qiksearch.ru/javascripts.htm",
"http://intellisearch.cjb.net",
"http://www.qiksearch.ru",
"http://www.qiksearch.ru/articles.htm" ); // No comma after last ticker url
function tick()
{
if(count<ticker_msg.length)
{
this.document.qiksearch_ticker.qiksearch_ticker.value=ticker_msg[count];
count++;
if(count==ticker_msg.length)
{
count=0;
}
setTimeout("tick();",ticker_speed*1000);
}
}
function goURL()
{
if(this.document.qiksearch_ticker.qiksearch_ticker.value==ticker_msg[ticker_msg.length-1])
{
location.href=ticker_url[ticker_msg.length-1];
}
else
{
location.href=ticker_url[count-1];
}
}
function inv_button()
{
if (navigator.appName=="Microsoft Internet Explorer" || (navigator.appName=="Netscape" && navigator.appVersion >= "5"))
{
if (inv_button_flag==0)
{
this.document.qiksearch_ticker.inv_but.value="6";
this.document.qiksearch_ticker.inv_but.title="Tick Down Direction";
inv_button_flag=1;
}
else
{
this.document.qiksearch_ticker.inv_but.value="5";
this.document.qiksearch_ticker.inv_but.title="Tick Up Direction";
inv_button_flag=0;
}
}
else
{
if (inv_button_flag==0)
{
this.document.qiksearch_ticker.inv_but.value="Down";
inv_button_flag=1;
}
else
{
this.document.qiksearch_ticker.inv_but.value="Up";
inv_button_flag=0;
}
}
}
function inv_msg()
{
for(var i=0;i<Math.floor(ticker_msg.length/2);i++)
{
var temp=ticker_msg[i];
ticker_msg[i]=ticker_msg[ticker_msg.length-1-i];
ticker_msg[ticker_msg.length-1-i]=temp;
}
}
function inv_URL()
{
for(var i=0;i<Math.floor(ticker_msg.length/2);i++)
{
var temp=ticker_url[i];
ticker_url[i]=ticker_url[ticker_msg.length-1-i];
ticker_url[ticker_msg.length-1-i]=temp;
}
}
tick();
</script>
<table width="400" align="center" cellspacing="0" cellpadding="0"><tr><td>
<font face="verdana,arial,helvetica" size="-1" color="#000000">
This is a Cross Browser Javascript Button Ticker that ticks a number of messages on a button.You can change the direction in which the message ticks. (i.e the order in which the message ticks).
<br><br>This ticker is very easy to customise. You can add any number of messages and their corresponding URLs. Messages must be added to the array <font face="courier">ticker_msg</font> and the URLs must
be added to the array <font face="courier">ticker_url</font>.
<br><br>This ticker ticks the messages on a button. You can change the style of the button easily.
<br><br>The ticker speed can be changed easily by changing the value of the variable <font face="courier">ticker_speed</font>. (Here it is 1, which means that the message would change every 1 second.)
<br><br>To use this script, you just have to copy the <script> section of the source and paste it wherever you require on your web page.
<br><br><hr style="width:100%; height:1; color:#000000">
<a href="mailto:premshree@hotmail.ru?Subject=Javascripts" class="link">© 2002 Premshree Pillai. All rights reserved.</a>
</font>
</td></tr></table>
</center>
</body>
</html>
Fading Ticker for IE
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Fading Ticker for IE</title>
<!--BEGIN HEAD SECTION CODE-->
<script language="JavaScript">
// Fading Ticker for IE
// (c) 2002 Premshree Pillai
// http://www.qiksearch.ru
// qiksearch@rediffmail.ru
// Function to set the Ticker
function setTicker(divName, msgArr, tickCount, timeOut, fadeSwitch)
{
if(fadeSwitch==1)
{
tickerFadeIn(divName, msgArr, tickCount, timeOut);
}
if(fadeSwitch==0)
{
tickerFadeOut(divName, msgArr, tickCount, timeOut);
}
}
// Fade In
function tickerFadeIn(divName, msgArr, tickCount, timeOut)
{
try
{
msgArr=msg1;
document.getElementById(divName).innerHTML=msgArr[tickCount];
if(document.getElementById(divName).filters("alpha").opacity < 100)
{
document.getElementById(divName).filters("alpha").opacity += 5;
setTimeout("tickerFadeIn(""+divName+"",""+msgArr+"",""+tickCount+"",""+timeOut+"")",timeOut);
}
else
{
if(tickCount==(msgArr.length-1))
{
tickCount=0;
}
else
{
tickCount++;
}
document.getElementById(divName).filters("alpha").opacity = 0;
tickerFadeIn(divName, msgArr, tickCount, timeOut);
}
}
catch(e)
{
alert("This Ticker works with IE 5+ only.")
}
}
// Fade Out
function tickerFadeOut(divName, msgArr, tickCount, timeOut)
{
try
{
msgArr=msg1;
document.getElementById(divName).innerHTML=msgArr[tickCount];
if(document.getElementById(divName).filters("alpha").opacity >0)
{
document.getElementById(divName).filters("alpha").opacity -= 5;
setTimeout("tickerFadeOut(""+divName+"",""+msgArr+"",""+tickCount+"",""+timeOut+"")",timeOut);
}
else
{
if(tickCount==(msgArr.length-1))
{
tickCount=0;
}
else
{
tickCount++;
}
document.getElementById(divName).filters("alpha").opacity = 100;
tickerFadeOut(divName, msgArr, tickCount, timeOut);
}
}
catch(e)
{
alert("This Ticker works with IE 5+ only.")
}
}
</script>
<!--END HEAD SECTION CODE-->
</head>
<body bgcolor="#FFFFFF">
<center>
<font face="verdana,arial,helvetica" size="5" color="#807CC0"><b>Fading Ticker for IE</b></font>
<br><br>
<!--BEGIN BODY SECTION CODE-->
<script language="JavaScript">
// Fading Ticker for IE
// BODY section code
document.write("<div style="width:50%; border:#000000 solid 1px">");
document.write("<div id="div1" style="filter:Alpha(opacity=0); width:100%; display:block; background:#FFFFFF; padding:5px; -moz-opacity:0"></div>");
document.write("</div>");
var msg1=new Array("<center><font color="#000000" face="verdana,arial,helvetica" size="-1"><b>Premshree</b></font></center>","<center><font color="#000000" face="verdana,arial,helvetica" size="-1"><b>Pillai</b></font></center>","<center><font color="#000000" face="verdana,arial,helvetica" size="-1"><b>Welcomes you to.....</b></font><center>","<center><a href="http://www.qiksearch.ru/javascripts.htm"><img src="http://www.wbex.ru/style/logo.png" border="0" alt="essentialjs from Qiksearch.ru"></a></center>");
var tick1=0;
var timeOut1=150;
setTicker("div1", msg1, tick1, timeOut1, 1);
</script>
<!--END BODY SECTION CODE-->
<br>
<table width="390" align="center"><tr><td><font face="verdana,arial,helvetica" size="-1" color="#000000">This JavaScript is a "Fading Ticker" for IE.The Ticker uses the Microsoft
"Alpha" filter.<br><br>You can add any HTML content to the messages. The entire content will fade. You can fade the messages "IN" or "OUT".<br><br>The Ticker is set using the setTicker() function. Here is the description of the arguments setTicker() takes :<br><br><b>divName</b> : The "ID" of the element containing the messages.<br><b>msgArr</b> : The array containing the messages.<br><b>tickCount</b> : Ticker counter that should be initialised to "0".<br><b>timeOut</b> : The delay in milliseconds.<br><b>fadeSwitch</b> : "1" to "Fade In", "0" to "Fade Out".<br><br>See the <a href="javascript:void(document.location="view-source:"+document.location)"><font color="#807CC0">source</font></a> to see how to set the ticker. The script consists of a HEAD section and a BODY section.<hr style="color:#000000; height:1px">© 2002 <a href="http://www.qiksearch.ru" title="Click here to visit Qiksearch.ru"><font color="#807CC0">Premshree Pillai</font></a>.</font></td></tr></table>
</body>
</html>
JavaScript Ticker 1.3 (IE)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>JavaScript Ticker 1.3</title>
<style type="text/css">
.link{font-family:verdana,arial,helvetica; font-size:8pt; color:#003399; font-weight:normal}
.link:hover{font-family:verdana,arial,helvetica; font-size:8pt; color:#0099FF; font-weight:normal}
.tick{font-family:verdana,arial,helvetica; font-size:10pt; color:#003399; font-weight:bold}
.tick:hover{font-family:verdana,arial,helvetica; font-size:10pt; color:#0099FF; font-weight:bold}
.tick_news_all{font-family:verdana,arial,helvetica; font-size:8pt; color:#808080; font-weight:normal}
.tick_news_all:hover{font-family:verdana,arial,helvetica; font-size:8pt; color:#000000; font-weight:normal}
.header{font-family:arial,verdana,helvetica; font-size:20pt; color:#DEAC00; font-weight:bold}
.tickerFX1{font-family:arial,verdana,helvetica; font-size:7pt; background:#EFEFEF; width:50; cursor:hand; border:1px solid #808080}
.tickerFX2{font-family:arial,verdana,helvetica; font-size:7pt; background:#EFEFEF; width:50; cursor:hand; border:1px solid #808080}
.speed{font-family:verdana,arial,helvetica; font-size:10pt; color:#FF0000; font-weight:bold}
.speed:hover{font-family:verdana,arial,helvetica; font-size:10pt; color:#FA5D00; font-weight:bold}
</style>
<script language="javascript">
// Location of this script:
// http://www.qiksearch.ru/javascripts/ticker13.htm
//*********************************************
//* JavaScript Ticker 1.3 *
//* Ticks a number of messages *
//* (c) Premshree Pillai, *
//* http://www.qiksearch.ru *
//* E-mail : premshree@hotmail.ru *
//* Created on 02/26/02 *
//* Use the script freely as long as this *
//* message is intact *
//* Visit www.qiksearch.ru/javascripts.htm *
//* for more FREE scripts *
//*********************************************
window.onerror = null;
var bName = navigator.appName;
var bVer = parseInt(navigator.appVersion);
var NS4 = (bName == "Netscape" && bVer >= 4);
var IE4 = (bName == "Microsoft Internet Explorer"
&& bVer >= 4);
var NS3 = (bName == "Netscape" && bVer < 4);
var IE3 = (bName == "Microsoft Internet Explorer"
&& bVer < 4);
var i=0;
var top_pos = 60;
var left_pos = 190;
var time_length = 1000;
var div_name = "qiksearch";
var ticker_msg = new Array(
"Welcome to Qiksearch",
"Intellisearch Bar NOW!",
"Premshree Pillai",
"Meta Tag Generator Online",
"Free JavaScripts" );
var ticker_url = new Array(
"http://www.qiksearch.ru",
"http://intellisearch.cjb.net",
"http://premshree.qik.cjb.net",
"http://metataggen.qik.cjb.net",
"http://www.qiksearch.ru/javascripts.htm" );
var ticker_len = ticker_msg.length;
for(var l=0; l<ticker_len; l++)
{
document.write("<div id="" + div_name + l + "" style="position:absolute; visibility:hidden; top:" + top_pos + "; left:" + left_pos + "">" + "<table bgcolor="#000000" cellspacing="0" cellpadding="1" width="400"><tr><td><table width="100%" id="ticker_container" style="background:#EFEFFF"><tr><td width="100%"><center><a href="" + ticker_url[l] + "" class="tick">" + ticker_msg[l] + "</center></a></td>");
document.write("<td align="right"><table class="tickerFX1" cellspacing="0" cellpadding="0" onclick="tickerFX_listAll('all_news_div'); hideLayer('change_speed_div')" title="List All News"><tr><td align="middle">LIST ALL</td></tr></table></td>");
document.write("<td align="right"><table class="tickerFX2" cellspacing="0" cellpadding="0" onclick="tickerFX_changeSpeed('change_speed_div'); hideLayer('all_news_div')" title="Change Ticker Speed"><tr><td align="middle">SPEED</td></tr></table></td>");
document.write("</tr></table></td></tr></table>" + "</div>");
}
document.write("<div id="all_news_div" style="position:absolute; top:" + (top_pos+21) + "; left:" + left_pos + "; visibility:hidden">");
document.write("<table width="400" align="center" style="background:#EFEFFF; border:1px solid #000000; border-top-width:0"><tr><td>");
for(var l=0; l<ticker_len; l++)
{
document.write("<b><font face="verdana,arial,helvetica">»</font></b> <a href="" + ticker_url[l] + "" class="tick_news_all">" + ticker_msg[l] + "</a><br>");
}
document.write("</td></tr></table>");
document.write("</div>");
document.write("<div id="change_speed_div" style="position:absolute; top:" + (top_pos+21) + "; left:" + left_pos + "; visibility:hidden">");
document.write("<table width="400" align="center" style="background:#EFEFFF; border:1px solid #000000; border-top-width:0"><tr><td>");
document.write("<font face="verdana,arial,helvetica" color="#000000"><b><a href="javascript:changeSpeed(5);" class="speed">5</a> | <a href="javascript:changeSpeed(4);" class="speed">4</a> | <a href="javascript:changeSpeed(3);" class="speed">3</a> | <a href="javascript:changeSpeed(2);" class="speed">2</a> | <a href="javascript:changeSpeed(1);" class="speed">1</a>");
document.write("</td></tr></table>");
document.write("</div>");
if (NS4 || IE4) {
if (navigator.appName == "Netscape") {
layerStyleRef="layer.";
layerRef="document.layers";
styleSwitch="";
}else{
layerStyleRef="layer.style.";
layerRef="document.all";
styleSwitch=".style";
}
}
//SCROLL
function tick(){
if (NS4 || IE4) {
if(i<ticker_len)
{
if(i==0)
{
eval(layerRef+"[""+div_name+(ticker_len-1)+""]"+
styleSwitch+".visibility="hidden"");
}
if(i>0)
{
eval(layerRef+"[""+div_name+(i-1)+""]"+
styleSwitch+".visibility="hidden"");
}
eval(layerRef+"[""+div_name+i+""]"+
styleSwitch+".visibility="visible"");
}
if(i<ticker_len-1)
{
i++;
}
else
{
i=0;
}
setTimeout("tick()",time_length);
}
}
var list_news_flag=0;
var change_speed_flag=0;
function tickerFX_listAll(layerName)
{
if(list_news_flag==0)
{
list_news_flag=1;
if(NS4 || IE4)
{
eval(layerRef+"[""+layerName+""]"+
styleSwitch+".visibility="visible"");
}
}
else
{
list_news_flag=0;
if(NS4 || IE4)
{
eval(layerRef+"[""+layerName+""]"+
styleSwitch+".visibility="hidden"");
}
}
}
function tickerFX_changeSpeed(layerName)
{
if(change_speed_flag==0)
{
change_speed_flag=1;
if(NS4 || IE4)
{
eval(layerRef+"[""+layerName+""]"+
styleSwitch+".visibility="visible"");
}
}
else
{
change_speed_flag=0;
if(NS4 || IE4)
{
eval(layerRef+"[""+layerName+""]"+
styleSwitch+".visibility="hidden"");
}
}
}
function hideLayer(layerName)
{
if(NS4 || IE4)
{
eval(layerRef+"[""+layerName+""]"+
styleSwitch+".visibility="hidden"");
}
}
function changeSpeed(n)
{
time_length=n*1000;
}
tick();
</script>
</head>
<body bgcolor="#FFFFFF">
<center>
<span class="header">JavaScript Ticker 1.3</span>
</center>
<br><br><br>
<table align="center" width="400" cellspacing="0" cellpadding="0"><tr><td>
<font face="verdana,arial,helvetica" size="-1" color="#000000">
This is a JavaScript Ticker which ticks a number of messages like the one shown above.
You can add more messages in the array <font face="courier">ticker_msg</font>. The URL for that
message should be added to the array <font face="courier">ticker_url</font>.
<br><br>Change the position of the ticker by changing the variables <font face="courier">top_pos</font> and <font face="courier">left_pos</font>. You can change the ticker speed by changing the value of the variable <font face="courier">time_length</font>. (Here it is 1000, which means that the ticker message will change every 1000 milliseconds, i.e every 1 second).
<br><br><b>New in Version 1.3</b> : In this version the new additions are the "List All" and "Speed" buttons.
<br>The "List All" button will list all the news items that appear in the ticker, together.
<br>Using the "Speed" button you can change the speed of ticking. When you click on the "Speed" button 5 options will appear. When you click on any one of these, the ticker speed will change to that value.
</font>
</td></tr></table>
<br>
<hr style="width:400; height:1; color:#9E9EFF">
<table align="center" width="400"><tr><td><font face="verdana,arial,helvetica" size="-2" color="#000000"><a href="mailto:premshree@hotmail.ru" class="link">© 2002 Premshree Pillai</a>, <a href="http://www.qiksearch.ru" class="link">Qiksearch.ru</a></font></td></tr></table>
</body>
</html>
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.ru
// qiksearch@rediffmail.ru
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.ru
// qiksearch@rediffmail.ru
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>
<A href="http://www.wbex.ru/Code/JavaScriptDownload/ticker_tdc.zip">ticker_tdc.zip( 2 k)</a>
News Bar
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>News Bar</title>
<style type="text/css">
.link{font-family:verdana,arial,helvetica; font-size:8pt; color:#008000; font-weight:normal}
.link:hover{font-family:verdana,arial,helvetica; font-size:8pt; color:#00B400; font-weight:normal}
.header{font-family:arial,verdana,helvetica; font-size:20pt; color:#008000; font-weight:bold}
</style>
</head>
<body bgcolor="#FFFFFF">
<center>
<span class="header">News Bar</span>
<br>
<script language="javascript">
//**************************************************
// News Bar *
// Date created : 1 March, 2002 *
// (c) 2002 Premshree Pillai. All rights reserved. *
// http://www.qiksearch.ru *
// premshree@hotmail.ru *
// Visit http://www.qiksearch.ru/javascripts.htm *
// for FREE scripts *
// Use freely as long as this message is intact *
//**************************************************
// Location : http://www.qiksearch.ru/javascripts/news-bar.htm
var count=0;
if (navigator.appName=="Microsoft Internet Explorer" || (navigator.appName=="Netscape" && navigator.appVersion >= "5"))
{
document.write("<form name="news_bar"><input type="button" value="3" onclick="javascript:prev_news()" style="width:22; height:22; font-family:webdings; background:#FFFFFF; border-left-width:1px; border-right-width:0px; border-top-width:1px; border-bottom-width:1px; border-color:#000000; cursor:hand" name="prev" title="Previous News"><input type="button" name="news_bar_but" onclick="goURL();" style="color:#000000;background:#FFFFFF; width:350; height:22; border-width:1; border-color:#000000; cursor:hand" onmouseover="this.style.background='#E1FFE1';return true" onmouseout="this.style.background='#FFFFFF';return true" onmousedown="this.style.background='#00C000';return true"><input type="button" value="4" onclick="javascript:next_news();" style="width:22; height:22; font-family:webdings; background:#FFFFFF; border-left-width:0; border-right-width:1px; border-top-width:1px; border-bottom-width:1px; border-color:#000000; cursor:hand" name="next" title="Next News"></form>");
}
else
{
document.write("<form name="news_bar"><input type="button" value="Previous" onclick="javascript:prev_news();"><input type="button" name="news_bar_but" onclick="goURL();" width="300" border="0"><input type="button" value="Next" onclick="javascript:next_news();"></form>");
}
var msgs = new Array(
"Welcome to Qiksearch",
"FREE Javascripts",
"Intellisearch Bar NOW!",
"www.qiksearch.ru",
"FREE Articles" ); // No comma after last ticker msg
var msg_url = new Array(
"http://www.qiksearch.ru",
"http://www.qiksearch.ru/javascripts.htm",
"http://intellisearch.cjb.net",
"http://www.qiksearch.ru",
"http://www.qiksearch.ru/articles.htm" ); // No comma after last ticker url
function init_news_bar()
{
this.document.news_bar.news_bar_but.value=msgs[count];
}
function prev_news()
{
if(count>0)
{
count-=1;
this.document.news_bar.news_bar_but.value=msgs[count];
}
else
{
window.alert("This is the first News Item");
}
}
function next_news()
{
if(count<msgs.length-1)
{
count+=1;
this.document.news_bar.news_bar_but.value=msgs[count];
}
else
{
window.alert("This is the last News Item");
}
}
function goURL()
{
location.href=msg_url[count];
}
init_news_bar();
</script>
<table width="400" align="center" cellspacing="0" cellpadding="0"><tr><td>
<font face="verdana,arial,helvetica" size="-1" color="#000000">
This is a Cross Browser Javascript News Bar that displays a number of messages on a button.
To see the next news item, click on the right arrow (Next). To view the previous news item, click on the left arrow. (Previous)
<br><br>This news bar is very easy to customise. You can add any number of messages and their corresponding URLs. Messages must be added to the array <font face="courier">msgs</font> and the URLs must
be added to the array <font face="courier">msg_url</font>.
<br><br>This news bar displays the messages on a button. You can change the style of the button easily.
<br><br>To use this script, you just have to copy the <script> section of the source and paste it wherever you require on your web page.
<br><br><hr style="width:100%; height:1; color:#007000">
<a href="mailto:premshree@hotmail.ru?Subject=Javascripts" class="link">© 2002 Premshree Pillai. All rights reserved.</a>
</font>
</td></tr></table>
</center>
</body>
</html>
Text Box Ticker
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Text Box Ticker</title>
<style type="text/css">
.link{font-family:verdana,arial,helvetica; font-size:8pt; color:#808080; font-weight:normal}
.link:hover{font-family:verdana,arial,helvetica; font-size:8pt; color:#FF9900; font-weight:normal}
.header{font-family:arial,verdana,helvetica; font-size:25pt; color:#FF9900; font-weight:bold; filter:DropShadow(color=#000000, offX=2, offY=2, positive=1); width:100%}
.TextBoxTicker{background:#FCFCFC; border:#808080 solid 1px; text-align:center; cursor:pointer}
</style>
</head>
<body bgcolor="#FFFFFF">
<center>
<span class="header">Text Box Ticker</span>
<br>
<script language="JavaScript">
// Text Box Ticker
// (c) 2002 Premshree Pillai.
// http://www.qiksearch.ru
// qiksearch@rediffmail.ru
document.write("<form name="qiksearch_ticker"><input type="text" class="TextBoxTicker" onfocus="goURL();this.blur();" name="qiksearch_ticker" size="55"></form>");
var count=0;
var ticker_speed=1;
// Ticker messages
var ticker_msg = new Array(
"Welcome to Qiksearch",
"Download Javascripts",
"Intellisearch Bar NOW!",
"FREE Articles" ); // No comma after last ticker msg
// Ticker URLs
var ticker_url = new Array(
"http://www.qiksearch.ru",
"http://www.simtel.net/pub/pd/57885.html",
"http://www.simtel.net/pub/pd/57634.html",
"http://www.qiksearch.ru/articles.htm" ); // No comma after last ticker url
function TextBoxTicker()
{
if(count<ticker_msg.length)
{
this.document.qiksearch_ticker.qiksearch_ticker.value=ticker_msg[count];
count++;
if(count==ticker_msg.length)
{
count=0;
}
setTimeout("TextBoxTicker();",ticker_speed*1000);
}
}
function goURL()
{
if(this.document.qiksearch_ticker.qiksearch_ticker.value==ticker_msg[ticker_msg.length-1])
{
location.href=ticker_url[ticker_msg.length-1];
}
else
{
location.href=ticker_url[count-1];
}
}
TextBoxTicker();
</script>
<table width="400" align="center" cellspacing="0" cellpadding="0"><tr><td>
<font face="verdana,arial,helvetica" size="-1" color="#000000">
This is a Javascript Text Box Ticker that ticks a number of messages on a Text Box.
<br><br>This ticker is very easy to customise. You can add any number of messages and their corresponding URLs. Messages must be added to the array <font face="courier">ticker_msg</font> and the URLs must
be added to the array <font face="courier">ticker_url</font>.
<br><br>The ticker speed can be changed easily by changing the value of the variable <font face="courier">ticker_speed</font>. (Here it is 1, which means that the message would change every 1 second.)
<br><br>To use this script, you just have to copy the <script> section of the source and paste it wherever you require on your web page.
<br><br><hr style="width:100%; height:1; color:#000000">
<a href="http://www.qiksearch.ru" class="link">© 2002 Premshree Pillai. All rights reserved.</a>
</font>
</td></tr></table>
</center>
</body>
</html>
XML Ticker (IE)
<!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>
<center><br>
<!--BEGIN XML TICKER BY PREMSHREE PILLAI-->
<script language="JavaScript1.2">
// XML Ticker JavaScript
// (c) 2002 Premshree Pillai
// http://www.qiksearch.ru
// Use freely as long as all messages are as it is
// Location of script : http://www.qiksearch.ru/javascripts/xml/ticker.htm
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") + "}<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 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>
<!--END XML TICKER BY PREMSHREE PILLAI-->
</center><br>
<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><br>
<table align="center"><tr><td>
<font face="verdana,arial,helvetica" size="-1" color="#000000">
<b>TICKER</b><br>
<img src="section.gif" width="13" height="13"> tickerstyle<br>
<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<br>
<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<br>
<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.ru" class="link">© 2002 Premshree Pillai. All rights reserved.</td></tr></table>
</td></tr></table>
</body>
</html>