...

View Full Version : [HELP] Javascript OO function scope



aku
01-14-2007, 10:19 PM
Hi guys,

I made this script in OO, for animated toggle effect. But when i try to use the script return an error arrived at 'this.obj.style.overflow = 'hidden' ;' and it sad that this.obj has not properties. I think this cause window.setInterval execute the function this.collapse in a scope where this.obj it's not defined.
How can i fix this error using the same syntax ( not referencing variables ) ?

i'm sorry for my wrong english!! :P





function Toggle ( trigger, obj, speed ) {

this.intervalId = null ;
this.trigger = trigger ;
this.obj = obj ;
this.speed = speed ;

this.create = function () {
window.clearInterval ( this.intervalId ) ;
if ( !this.speed )
this.speed = parseInt ( 100 / 30 ) ;
if ( !this.obj.style.display ) {
this.trigger.innerHTML = '+' ;
this.intervalId = window.setInterval ( this.collapse, 1 ) ;
}
else {
this.trigger.innerHTML = '-' ;
this.intervalId = window.setInterval ( this.expand, 1 ) ;
}
}

this.expand = function () {
this.obj.style.display = '' ;
if ( this.getHeight () < 100 ) {
this.obj.style.height = this.getHeight () + this.speed + 'px' ;
}
else {
this.obj.style.height = 100 + 'px' ;
window.clearInterval ( this.intervalId ) ;
}
}

this.collapse = function () {
this.obj.style.overflow = 'hidden' ;
if ( this.getHeight () > 0 ) {
if ( this.speed > this.getHeight () )
this.obj.style.height = 0 + 'px' ;
else
this.obj.style.height = this.getHeight () - this.speed + 'px' ;
}
else {
this.obj.style.display = 'none' ;
window.clearInterval ( this.intervalId ) ;
}
}

this.getHeight = function () {
return this.obj.offsetHeight ;
}

}

shyam
01-15-2007, 01:06 AM
create closure (or whatever thats called...) like this



this.intervalId = window.setInterval ( function() {
this.collapse();
// or if that doesn't do the trick
// this.collapse.apply(this); // this is overkill :)
}, 1 ) ;



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum