Webmaster

DHTML : Text scrolling
Contents ]
Mikael Le Moal

Moving the Layer

Three generic functions deal with layer movement. The haut() and bas() functions are called up according to the direction of the scrolling, and they themselves call up the deplace() function to move the layer. Each of these functions has a very simple definition:

77: function deplace(x,y){
78: this.x=x;
79: this.y=y;
80: this.css.left=this.x
81: this.css.top=this.y
82: }
83: function bas(v){
84: if(this.y>Container.clipHeight-this.scrollHeight){
85: this.deplace(0,this.y-v)
86: if(loop) setTimeout(this.obj+".bas("+v+")",vitesse)
87: }
88: }
89: function haut(v){
90: if(this.y<0){
91: this.deplace(0,this.y-v)
92: if(loop) setTimeout(this.obj+".haut("+v+")",vitesse)
93: }
94: }

The bas() and haut() functions determine the direction of the scrolling: upwards or downwards. A check is carried out to verify whether one of the layer's edges has been reached. In this case, we stop the scrolling (lines 84 and 90).

If no limit has been reached, the animation continues. The layer is then moved by calling on the deplace() function (lines 85 and 91), and a timer is started. This latter will re-execute the procedure (haut() or bas(), depending on the user's choice) to keep the scrolling going.

The déplace() function will simply modify the layer's positioning coordinates (this.css.left and this.css.top), hence moving the layer.



  1   2   3   4