Question

I know there are many questions about jQuery slideToggle “flickering” but I haven’t seen any that specifically address this flicker upon page load.

Click here for the working example.

If you click Refresh or click on another datasheet page (under the Datasheets & Product Info section), when the page loads, the hidden div “flashes” the expanded content and then quickly collapses. I notice this in Firefox, not so much in IE or Chrome. What can I do to prevent this? Does this depend on the speed with which the page loads?

Also, please excuse the nightmarish tabulated code. I inherited this from a previous developer. We are planning to go back and correct this in a later phase, but I’m wondering if there is a quick fix for this issue now.

Thanks!

Answer 1

Maybe display:none for elements like #mover2 ?
(of course, that also mean no graceful degradation)

EDIT (a reply to another question)
To avoid using #id, #id1, #id2 in your css, you can simply add an extra class to those divs, like hideThis.

Then, in CSS you can just add:
.hideThis {display:none; }