DHTML : Images scrolling under your titles
Dr Benton
Loop Animating
There is still a small problem to solve. What should we do when the animation reaches the our background's limit? The answer
is simple! We just need to reset the layer to its initial position. To do this, we use the
restart() function:
111: function restart() {
112: clipleft=0
113: clipright=messageboardwidth
114: if (document.all) {
115: document.all.bgdiv.style.posLeft=bgdivleft
116: }
117: if (document.layers) {
118: document.bgdiv.left=bgdivleft
119:
120: }
121: movebackground()
122: }
And since we are cautious, we saved the layer's start position in the
bgdivleft variable. The
restart() function sets the clipping window back to zero (lines 112 and 113) and moves the
bgdiv layer back to its initial position, using the
.posleft attribute (on line 115 for Internet Explorer) or the
.left attribute (on line 118 for Netscape Navigator).
Our scrolling can then
move around indefinitely.
Customise your script. A few details in our effect can be changed. Experiment for yourself! To help you along, we have placed comments in our source
code between lines 21 and 51.