Buongiorno a tutti.
So che ci sono un sacco di framework che farebbero al caso mio, ma sono un crapone e voglio sbatterci la testa
In sostanza, ho creato una funzione che modifica la dimensione di un div. Funziona alla perfezione su tutti i browser, il fatto è che non so come renderla più veloce, mantenendo però la fluidità "visiva".
Per esempio, la trasformazione dello sfondo bianco che appare cliccando su una delle foto della sezione "IMAGE SET", a questo indirizzo mi sembra abbastanza fluida e veloce.
Le mie domande sono: come posso raggiungere la stessa velocità degli script di scriptaculous e/o altri di framework? E' possibile, per un comune mortale?

La mia funzione è questa:

var timerDim = "";
function TDim(myObj, widthInit, heightInit, widthEnd, heightEnd, both) {
if (typeof myObj != "object") {
myObj = document.getElementById(myObj);
}
if ((widthInit == null) || (widthInit == "")){
widthInit = myObj.clientWidth;
}
if ((heightInit == null) || (heightInit == "")){
heightInit = myObj.clientHeight;
}
if ((widthEnd == null) || (widthEnd == "")){
widthEnd = myObj.clientWidth;
}
if ((heightEnd == null) || (heightEnd == "")){
heightEnd = myObj.clientHeight;
}

if ((widthInit == widthEnd) && (heightInit == heightEnd)) {
clearInterval(timerDim);
return true;
} else {
if (both) {
myObj.style.width = widthInit + "px";
myObj.style.height = heightInit + "px";
if(widthInit<widthEnd) {
widthInit++;
} else if (widthInit>widthEnd) {
widthInit--;
}
} else {
myObj.style.height = heightInit + "px";
if (heightInit == heightEnd) {
myObj.style.width = widthInit + "px";
if(widthInit<widthEnd) {
widthInit++;
} else if (widthInit>widthEnd) {
widthInit--;
}
}
}
if(heightInit<heightEnd){
heightInit++;
} else if (heightInit>heightEnd) {
heightInit--;
}
timerDim = setTimeout(function () {TDim(myObj, widthInit, heightInit, widthEnd, heightEnd, both);}, 0);
}
}


I parametri che passo alla funzione sono l'oggetto da trasformare o il suo id, le dimensioni iniziali e finali, e la variabile booleana "both" che mi permette di scegliere se modificare altezza e larghezza contemporaneamente o prima l'una e poi l'altra.
So che mancano un sacco di controlli su eventuali parametri dai valori assurdi, prima o poi sistemerò anche quella parte.
Il setTimeout l'ho impostato a 0 millisecondi, ma più di tanto non va... I risultati sono accettabili sono con Chrome.

Grazie per le eventuali risposte!