Monday, August 17, 2009

Code: Use CSS to hide items instead of jQuery's ready method

if you are using $(document).ready() to hide items, it can cause the items you hide in that method to be shown for a short time before the method is executed, causing a flicker on the users screen.  To avoid this use style="display: none;" to make your item hidden.  Using visiblity:none won't work, when you call .show() jQuery won't override the style.  If you need to call a JavaScript method to determine if the item should be visible or not, set the display to hidden and then call your JavaScript method.  Its better for items to be hidden and then pop in than to have them display and pop out.