Scrolling HTML Basics, Part III: The HTML Feed - www.docjavascript.com

The HTML Feed

The HTML feed for our scroller box is a regular HTML file. You'll probably want to put bullets inside this page, separated by a <BR> or a <P> tag. Since we use two identical HTML files that are concatenated to each other, make sure there is an additional <BR> or <P> tag at the end of the file, or else it will be apparent where the stitching is.

You can format the bullets as you wish, add GIFs, and so on. Each bullet can be a link as well. Using links, you can provide a lot of pointers in your page, in a relatively small space.

In Internet Explorer, you have to call the fillCanvas() function from within your feed external file. Make sure to delay it, as otherwise unexpected results are achieved. Here is the script you need to put in the feed file:

<SCRIPT LANGUAGE="JavaScript1.2">
<!--
var pause = 100;
function start() {
  setTimeout("parent.fillCanvas()", pause);
}
if (IE4) {window.onload = start;}
//-->
</SCRIPT>

Here is our HTML feed that lists the first 29 DOC JavaScript columns:

<HTML>
<HEAD>
</HEAD>
<BODY bgcolor="#cccccc">
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column29/">
  <B>[29] DOCJSLIB Version 3.0: Page Watermarks</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column28/">
  <B>[28] DOCJSLIB Version 2.0</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column27/">
  <B>[27] DOCJSLIB Library, Part I</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column26/">
  <B>[26] JavaScript 1.3 Review, Part II</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column25/">
  <B>[25] JavaScript 1.3 Review, Part I</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column24/">
  <B>[24] Internet Explorer 5.0 Review, Part III</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column23/">
  <B>[23] Internet Explorer 5.0 Review, Part II</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column22/">
  <B>[22] Internet Explorer 5.0 Review, Part I</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column21/">
  <B>[21] Embedding Sound in Web Pages, Part II</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column20/">
  <B>[20] Embedding Sound in Web Pages, Part I</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column19/">
  <B>[19] JavaScript Animations, Part II</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column18/">
  <B>[18] JavaScript Animations, Part I</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column17/">
  <B>[17] Screen Properties</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column16/">
  <B>[16] Dynamic Tooltips</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column15/">
  <B>[15] Lookup Lists</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column14/">
  <B>[14] Pop-out Elements</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column13/">
  <B>[13] Scrolling JavaScript Banners</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column12/">
  <B>[12] JavaScript Selections</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column11/">
  <B>[11] The Cross-Browser Event Model</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column10/">
  <B>[10] The Internet Explorer Event Model</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column9/">
  <B>[09] The Navigator Event Model</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column8/">
  <B>[08] Crispy JavaScript Cookies</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column7/">
  <B>[07] Window Spawning and Remotes</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column6/">
  <B>[06] Browser Compatibility</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column5/">
  <B>[05] Regular Expressions</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column4/">
  <B>[04] Text Rollovers</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column3/">
  <B>[03] Rotating Text Banners</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column2/">
  <B>[02] Mastering JavaScript Dates</B></A>
<p>
<img class="bullet" src="bullet.gif">
<A CLASS="headline" HREF="/js/column1/">
  <B>[01] Universal JavaScript Rollovers</B></A>
<p>
</BODY>
</HTML>

Created: December 21, 1998
Revised: December 21, 1998

URL: https://www.webreference.com/js/column32/feed.html

Scrolling HTML Basics, Part III: The HTML Feed - www.docjavascript.com

The HTML Feed

Find a programming school near you