Here is the generic code used pretty much throughout the site:
This is used to give a background color to a
element in the navigation bar (so that I can use the same include file throughout that section of the site.)
It happens throughout the site, however... and if a page has more scripting, this is more noticeable. It happens in all browsers I have tested (i.e., FF, Safari Mac, Opera Mac, Chrome Mac, IE 8 Win & IE6 Win.
@keeganwatkins: You are 100% right. What I thought was a jQuery bug is actually this FOUC that you mention. I do have a number of stylesheets--for print & mobile.
Here is how I have dealt with it: I assigned the
tag a class of "boo." "Boo" has only one declaration: "visibility:none;" I have added a snippet to the jQUery code in the head:
. THis has caused the pages to appear blank until the document is ready. Normally this is only a blink, and even the heavily scripted pages only take a second. Fortunately for me, none of my pages rely on multiple server requests, so I am confident that the user will not be inconvenienced.
However, I wonder if there is a more elegant, less degraded method for dealing with this... suggestions?