dp_texas
28 Jul 2009, 3:51 PM
I'm encountering what appears to be an IE-specific bug when using some of the built-in Ext Core effects.
Specifically, I've built something like a modal functionality to handle some interactions in the web application I'm working with. I'm using a semi-transparent, absolutely positioned div to highlight the modal and prevent interaction with the rest of the page.
In Firefox/Chrome/Safari, this background div behaves properly: it goes from hidden to about 50% opacity when activated. When deactivated, it disappears instantly until reactivated.
In IE 6, it behaves perfectly the first time it is activated. After that, it no longer fades back in when reactivated. At first I thought that my logic was causing it to remain set to visibility: hidden, but some checking in the Developer Toolbar revealed that in all other aspects than transparency, it was behaving perfectly. The Developer Toolbar even informed me that the proprietary filter: alpha(opacity) css property is properly set to 50.
In other words, it behaves exactly as expected in all other respects than actually being visible. All attributes are exactly the same as the first time is is activated, when it does appear.
I'm at a loss. Has anyone else had this experience while building a modal type function?
Here is the relevant section of my code.
Ext.Ajax.on('modalupdated',function(response,callback){
popup.update(response.responseText);
if(Ext.isFunction(callback))
callback();
popup.show();
if(!that.active){
overlay.fadeIn({
endOpacity: .5,
duration: .4
})
}
popup.center();
RA.imgRolls(popup);
that.active = true;
},this)
Specifically, I've built something like a modal functionality to handle some interactions in the web application I'm working with. I'm using a semi-transparent, absolutely positioned div to highlight the modal and prevent interaction with the rest of the page.
In Firefox/Chrome/Safari, this background div behaves properly: it goes from hidden to about 50% opacity when activated. When deactivated, it disappears instantly until reactivated.
In IE 6, it behaves perfectly the first time it is activated. After that, it no longer fades back in when reactivated. At first I thought that my logic was causing it to remain set to visibility: hidden, but some checking in the Developer Toolbar revealed that in all other aspects than transparency, it was behaving perfectly. The Developer Toolbar even informed me that the proprietary filter: alpha(opacity) css property is properly set to 50.
In other words, it behaves exactly as expected in all other respects than actually being visible. All attributes are exactly the same as the first time is is activated, when it does appear.
I'm at a loss. Has anyone else had this experience while building a modal type function?
Here is the relevant section of my code.
Ext.Ajax.on('modalupdated',function(response,callback){
popup.update(response.responseText);
if(Ext.isFunction(callback))
callback();
popup.show();
if(!that.active){
overlay.fadeIn({
endOpacity: .5,
duration: .4
})
}
popup.center();
RA.imgRolls(popup);
that.active = true;
},this)