| home / experts / dhtml / column13 |
|
This page includes the browser-specific scripts for Explorer 4 and Navigator 4.
All versions of the fader use this external file format (news.js):
prefix="http://www.internetnews.com/" arURL = new Array( "isp-news/1998/01/2301-high.html", "fina-news/1998/01/2301-excite.html", "ec-news/1998/01/2301-virtual.html", "Reuters/may.html", "Reuters/modem.html", "Reuters/rumors.html", "Reuters/test.html", "fina-news/1998/01/2301-usa-loss.html", "intl-news/1998/01/2301-nk.html", "ec-news/1998/01/2302-net.html", "prod-news/1998/01/2301-mesa.html", "wd-news/1998/01/2301-snow.html", "bus-news/1998/01/2301-shep.html" ) arTXT = new Array( "High-Speed Hotel Access on the Horizon", "Excite Reports Increased Revenues", "Virtual Reality E-Shopping Site Launches", "Microsoft May Face New Antitrust Case", "Ameritech in Compaq High-Speed Modem Deal", "Microsoft Declines Comment on BT Rumors", "Integrion Says Three Banks Test Electronic System", "Silicon Graphics Posts $31M Loss", "N2K, StarMedia in Lat. Amer. E-Commerce Initiative", "CitX, Priority One Launch Net Payment System", "MESA Suite Brings Self-Service to the Enterprise", "Snowbound Releases Raster Imaging Development Tool", "Net Shepherd Signs Revenue Deal With AltaVista" )
This code is specific to Explorer 4. No browser-detection is included.
<HTML>
<HEAD>
<STYLE TYPE="text/css">
#elAll {
position: relative;
width: 130;
height: 40;
background-color: white;
}
#elNews {
position: absolute;
width: 130;
height: 40;
background-color: white;
filter: blendTrans(duration=1);
}
A.newslink {
text-decoration: none;
text-align: left;
color: black;
font-size: 8pt;
font-weight: bold;
font-style: normal;
font-family: Arial,Geneva,sans-serif;
line-height: 9pt;
}
</STYLE>
<SCRIPT LANGUAGE="JavaScript1.2" SRC="news.js"></SCRIPT>
<SCRIPT LANGUAGE="JavaScript1.2">
arNews = new Array();
for (i=0; i<arURL.length; i++) {
arNews[i] = new Array();
arNews[i][0] = prefix + arURL[i];
arNews[i][1] = arTXT[i];
}
blendInt = 5;
maxLoops = 2;
finite = (maxLoops > 0) ? 1 : 0;
window.onload = initIt;
function initIt(){
newsCount = 0;
if (finite) loopCount = 0;
doIt();
blendTimer = setInterval("doIt()",blendInt*1000)
}
function doIt() {
if (finite && loopCount==maxLoops) {
clearInterval(blendTimer);
return;
}
newsStr = "<A CLASS=newslink "
+ "HREF=" + arNews[newsCount][0] + ">"
+ arNews[newsCount][1] + "</A>"
elNews.filters.blendTrans.Apply();
elNews.innerHTML = newsStr;
elNews.filters.blendTrans.Play();
newsCount++;
if (newsCount == arNews.length) {
newsCount=0;
if (finite) loopCount++;
}
}
</SCRIPT>
</HEAD>
<BODY>
.
. preceding page HTML
.
<DIV ID="elAll">
<DIV ID="elNews"></DIV>
</DIV>
.
. subsequent page HTML
.
</BODY>
</HMTL>
This code is specific to Navigator 4. No browser-detection is included.
<HTML>
<HEAD>
<STYLE TYPE="text/css">
#elAll {
position: relative;
width: 130;
layer-background-color: white;
clip: rect(0 130 40 0);
}
#elNews {
position: absolute;
width: 130;
layer-background-color: white;
clip: rect(0 130 40 0);
}
#elGif {position: absolute;}
A.newslink {
text-decoration: none;
text-align: left;
color: black;
font-size: 8pt;
font-weight: bold;
font-style: normal;
font-family: Arial,Geneva,sans-serif;
line-height: 9pt;
}
</STYLE>
<SCRIPT LANGUAGE="JavaScript1.2" SRC="news.js"></SCRIPT>
<SCRIPT LANGUAGE="JavaScript1.2">
arNews = new Array();
for (i=0; i<arURL.length; i++) {
arNews[i] = new Array();
arNews[i][0] = prefix + arURL[i];
arNews[i][1] = arTXT[i];
}
blendInt = 5;
maxLoops = 2;
finite = (maxLoops > 0) ? 1 : 0;
boxHgt = 40;
blendDur = 1;
slideInc = 2;
slideInt = (blendDur/(boxHgt/slideInc))*1000;
window.onload = initIt;
function initIt(){
elAll = document.elAll;
elNews = elAll.document.elNews;
elGif = elAll.document.elGif;
imStr = "<IMG SRC='fade.gif'>"
elGif.document.write(imStr);
elGif.document.close();
newsCount = 0;
if (finite) loopCount = 0;
doIt();
blendTimer = setInterval("doIt()",blendInt*1000)
}
function doIt() {
if (finite && loopCount==maxLoops) {
clearInterval(blendTimer);
return;
}
elGif.top = 0;
newsStr = "<A CLASS=newslink "
+ "HREF=" + arNews[newsCount][0] + ">"
+ arNews[newsCount][1] + "</A>"
with (elNews.document) {
write(newsStr);
close();
}
newsCount++;
if (newsCount == arNews.length) {
newsCount=0;
if (finite) loopCount++;
}
slideIt();
}
function slideIt(){
elGif.top += slideInc;
if (elGif.top >= boxHgt) return;
setTimeout("slideIt()",slideInt);
}
</SCRIPT>
</HEAD>
<BODY>
.
. preceding page HTML
.
<DIV ID="elAll">
<DIV ID="elNews"></DIV>
<DIV ID="elGif"></DIV>
</DIV>
.
. subsequent page HTML
.
</BODY>
</HMTL>
Our final page includes all the options discussed in this column.
Produced by Peter Belesis and
All Rights Reserved. Legal Notices.
Created: Jan. 28, 1998
Revised: Feb. 03, 1998
URL: http://www.webreference.com/dhtml/column13/allCode1.html