I've got a webpage where I hide the content of the page until the onload
JavaScript event is fired and then I unhide the content. It works quite well under Chrome, IE11 and IE10. But when I use IE9 the hiding of the content gets ignored UNTIL the page is fully loaded at which point the hiding comes into effect.
Because of that problem I moved the hiding from the JavaScript to the CSS instead and still same visual effect. So my question here is: Is the CSS only applied after the html has been fully loaded or am I overlooking something here? A bit of the code here:
#deactivate {
display: none;
}
<html>
<body>
<div id="deactivate">MycontentIsNotToBeShown</div>
<div>MyContentIsToBeShown</div>
</body>
</html>
$(document).ready(function() {
//......DO things and then as the last step:
$("#deactivate").first().show();
});
Like I said the disappearing of the "deactivate" div does not happen at least until the jQuery code begins its work (that is at least how it looks optically).
The whole page where this happens is a sharepoint page (sharepoint 2013)...a nintex form in view mode to be more exact. I'm not sure if it has anything to do with that OR if it has anything to do with the order of how things are loaded in IE9. Thus my question here if it can be that the order of how things are loaded/used in IE9 could cause this effect?
As an additional note here: I already checked if there are too many selectors in the .css which is seemingly not the case (I know that there is a limit in IE for how many selectors it will work through in a single .css file).
first()
on yourid
selector is redundant because you should only ever have unique id attributes within a page. If you have multiple elements with thedeactivate
id, then you should change it to a class.