[Javascript, Firefox & XHTML] Scroll

[Janky]

Ciao a tutti...
sto cercando di inserire in una mia pagina html un box scrollabile mediante metodo onmouseover su due immagini (ho copiato lo scipt da qui). Tutto funzionava perfettamente (Safari, Firefox, IE, Opera...), finchè non sono passato alla fase "validazione xhtml".... inserito il doctype, non funziona più lo scroll su Firefox (più in generale su browser gecko-based)... il codice utilizzato è questo:

function verifyCompatibleBrowser(){ 
    this.ver=navigator.appVersion 
    this.dom=document.getElementById?1:0 
    this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0; 
    this.ie4=(document.all && !this.dom)?1:0; 
    this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0; 
    this.ns4=(document.layers && !this.dom)?1:0; 
    this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5) 
    return this 
} 

bw=new verifyCompatibleBrowser()  
 
var speed=50 
 
var loop, timer 
 
function ConstructObject(obj,nest){
    nest=(!nest) ? '':'document.'+nest+'.' 
    this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+'document.'+obj):0;
    this.css=bw.dom?document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+'document.'+obj):0; 
    this.scrollHeight=bw.ns4?this.css.document.height:this.el.offsetHeight 
    this.clipHeight=bw.ns4?this.css.clip.height:this.el.offsetHeight 
    this.up=MoveAreaUp;this.down=MoveAreaDown; 
    this.MoveArea=MoveArea; this.x; this.y; 
    this.obj = obj + "Object" 
    eval(this.obj + "=this") 
    return this 
} 
function MoveArea(x,y){
    this.x=x;this.y=y;
    this.css.left=this.x 
   	this.css.top=this.y
} 
 
function MoveAreaDown(move){
        if(this.y>-this.scrollHeight+objContainer.clipHeight){ 
    this.MoveArea(0,this.y-move) 
    if(loop) setTimeout(this.obj+".down("+move+")",speed) 
        } 
} 
function MoveAreaUp(move){ 
        if(this.y<0){ 
    this.MoveArea(0,this.y-move) 
    if(loop) setTimeout(this.obj+".up("+move+")",speed) 
        } 
} 
 
function PerformScroll(speed){ 
        if(initialised){ 
                loop=true; 
                if(speed>0) objScroller.down(speed) 
                else objScroller.up(speed) 
        } 
} 
 
function CeaseScroll(){ 
    loop=false 
    if(timer) clearTimeout(timer) 
} 

var initialised; 
function InitialiseScrollableArea(){ 
    objContainer=new ConstructObject('BoxRight') 
    objScroller=new ConstructObject('text','BoxRight') 
    objScroller.MoveArea(0,0) 
    objContainer.css.visibility='visible' 
    initialised=true; 
} 

document.onkeydown = onKeyDown
document.onkeyup = onKeyUp

function onKeyDown(){
	code = event.keyCode
	switch (code)
	{
		case 38:	// Up Arrow
			PerformScroll(-7);
			break;
		case 40:	// Down Arrow
			PerformScroll(7);
			break;
		default:
	}
}

function onKeyUp(){
	if(event.keyCode == 38 || event.keyCode == 40)
		CeaseScroll();
}

il tutto inserito in un file .js e richiamato nella pagina html mediante tag script:

<script type="text/javascript" src="scripts/scroll.js"></script>

facendo un po' di debug all'interno dello script, mettendo un po' di alert qua e là, ho notato che nel momento in cui si verifica l'evento onmouseover viene eseguita la funzione moveArea, i parametri this.x e this.y al suo interno ricevono valori esatti, ma this.css.left e this.css.top (sempre all'interno della stessa funzione) rimangono sempre a 0. Che l'errore sia nell'assegnazione di this.css nella funzione ConstructObject? Vi prego aiutateemiiiiiii!!

[Janky]

up