jQuery Hides Some Divs On Page Load-But Not Fast Enough


I have used some jQuery to hide two divs (#choices and #review) until a selection of “yes” or “no” is made. My problem is that as the page loads, these div’s are displayed for a split second until the jQuery hides them. Can anyone tell me a better way or a fix for the existing code that I am using?

Thank you in advance!


Change the div to display: none through your CSS and have your javascript show/hide them

Yes, you can do as listed above; however, keep in mind that someone without javascript enabled will NEVER–EVER be able to see the ‘next step’ in the process unless you link the yes button and return false from the js.

This is the reason that jQuery shows the content first (for accessiblity for non js browsers).

Personally I just tell clients it’s the nature of the beast, it’s in their best interest.

Thanks for the fix and thanks for the input about browsers with javascript disabled. Just curious how many people have javascript disabled, on purpose or otherwise.

You could put a small amount of javascript early in the page that will add a style to the page for javascript users. In your case, the presence of this style should hide stuff.