DHTML : Pages with customised scrollbars
Dr Benton
The
init() function is called up from the <BODY> tag when the page loads. We will trigger our effect using this function.
To begin with, we will position the scrollbar and the cursor with the appropriate code for the visitor's browser:
128: function init() {
129: if (isNav) {
130: document.barre.left=posbarre_x
131: document.barre.top=posbarre_y
132:
133: document.curseur.left=poscurseur_x
134: document.curseur.top=poscurseur_y
135:
136: setNavEventCapture()
137: }
138: if (isIE) {
139: document.all.barre.style.posLeft=posbarre_x
140: document.all.barre.style.posTop=posbarre_y
141:
142: document.all.curseur.style.posLeft=poscurseur_x
143: document.all.curseur.style.posTop=poscurseur_y
144: }
The
posbarre_x,
posbarre_y,
poscurseur_x and
poscurseur_y variables are initialised on lines 11-21. The cursor position is dependent on the scrollbar location (
poscurseur_x = posbarre_x+20,
poscurseur_y = posbarre_y).
Let's take advantage of the browser detection block to initialise the
setNavEventCapture() function. This function captures the
onMouseUp,
onMouseMove and
onMouseDown mouse events. This small additional step is essential in the case of Netscape Navigator.
Once the required layers are in position, we must implement the mechanism that handles events.