JavaScript’s window.onunload resolves css display issue in IE and Opera
I noticed a rather odd issue in Internet Explorer (IE) and Opera, where by a HTML element whose visibility is toggled on and off (using a CSS class via JavaScript mouseover/out event listeners) stays visible when clicking the browsers BACK button.
Rather than reloading the page and thus rendering the element as hidden (until the user rolls their mouse over the relevant area to make the hidden element visible again), the element was visible immediately. I think this has something to do with how these browsers call the previous page’s content, maybe from some kind of cache? (if someone can enlighten me on why this happens in only these two browsers – Mozilla Firefox, Google Chrome and Apple Safari all worked fine – I would be grateful).
It seems the only way I could resolve the issue was to set-up a listener on the window object for the onunload event and to change back the CSS class of the element before the page unloaded…
window.onunload = function() { document.getElementById("serviceContent").className = "hide"; };
I’d like to know more about this and why IE and Opera render the page in this way when using their respective BACK buttons, any further information appreciated.

0
