Absolute Positioning in IE6 + AJAX + Fat client States
April 10th, 2006
For several months I’ve utilized position.js for a faux position: absolute; in Internet Explorer.
In my TfHC project, I used toggling the visibility of fieldsets to change the prompts available - like this:
document.getElementById("chat").style.display = "none";
document.getElementById("validate").style.display = "block";
This caused an issue with MSIE: The fieldsets not rendered on the original load (by having display:none; in the css) didn’t get their contents ‘fixed’ by position.js - they were still little boxes in the corners. So I had some window resizing code. It had to be slightly delayed, so IE wouldn’t streamline it out of existance.
if(_SARISSA_IS_IE) { /* force redraw - IE needs to fix layout of chat screen */
window.setTimeout("window.resizeBy(-1, -1)", 100);
window.setTimeout("window.resizeBy(1, 1)", 200);
}
And then I realized the window could be maximized, thus throwing off my whole window-resize fix.
Of course, I have to ask why I want these fieldsets not to display - and the fact is, I don’t. I just don’t want to see their contents - which are absolutely posittioned in reference to the window, not the fieldset. So I try a different method.
document.getElementById("chat").style.visibility = "hidden";
document.getElementById("validate").style.visibility = "visible";
And it works. Meaning, position.js fixes the sizes of everything the first time. No window resize required.
Posted in JavaScript |