David,
thanks.
I didn't use your code because I didn't think my code has any problem. This
seems to be occurring in IE only and related to page load - I thought it's
IE7/8 issue but IE9 too when the site has been browsing for a while and a
certain page is more heavier than other.
I use simple show hide
jQuery('#mini-cart').hide();
jQuery('#mini-cart-a').click(function() {
jQuery('#mini-cart').toggle(400);
return false;
});
#mini-cart {position:absolute; width:300px; overflow: hidden}
the hidden layer shouldn't show through during page load.
tee
On Jun 15, 2011, at 9:26 AM, David Hucklesby wrote:
> On 6/14/11 7:45 PM, tee wrote:
>> David,
>>
>> Thanks for the response. I made two screencasts.
>>
>> In advanced browsers and no problem. The "dropdown" at the left top
>> somtimes does show through if the connection is very slow and the
>> page takes more than 10 seconds to load.
>>
>> http://www.youtube.com/watch?v=Z11rqWBLLuc
>>
>>
>> In this movie taken from IE7, between 17 to 18 seconds you can see
>> the hidden layers (choose your tea and tea bag (2) ) shown through
>> while the page is still loading.
>> http://www.youtube.com/watch?v=dI9QvAFKoSM
>>
>> I am trying to find a way if it's possible to prevent this from
>> happening despite the slow connection.
>>
>>
>> On Jun 14, 2011, at 8:21 AM, David Hucklesby wrote:
>>
>>> On 6/13/11 6:31 PM, tee wrote:
>>>> Some pages of the site loads very slow in IE7 (about 15
>>>> seconds), and while the page was loading and (I assume) IE7 was
>>>> still parsing the scripts, all the hidden elements shown through.
>>>> I wander if there is a way to prevent this.
>>>>
>>>> https://picasaweb.google.com/weblist99/Jun132011?authkey=Gv1sRgCKrj4sKyz-33-gE&feat=directlink
> [...]
>>>
>>>
>>>>
> Here's what works for me. I include this code in the<head> of the document:
>>>
>>> <!-- add class="js" to html element if JavaScript is on --> <script
>>> type="text/javascript"> document.documentElement.className='js';
>>> </script>
>>>
>>> To display/hide an element, div#part-2 for example, use this CSS:
>>>
>>> .js #part-2 { display: none; } /* hide if JS is enabled */
>>>
>>> Apologies if I misunderstood. Your example code is beyond my
>>> comprehension this early morning... :(
>
>
> Tee,
>
> How are you hiding that content in the first place? (Your code is beyond
> my feeble brain's comprehension. Sorry.)
>
> This is exactly what the code I sent you is meant to avoid. Without JS,
> the hidden content shows up. With JS, the 'js' class is applied before
> the page loads. Thus the CSS rule to hide that content applies, and the
> content has no chance of appearing until your script overrides it.
>
> Does this not work for you? Or are you using this technique, and somehow
> find it fails?
>
> Sorry I can't be much more help.
> --
> Cordially,
> David
>
>
>
> *******************************************************************
> List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
> Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
> Help: [email protected]
> *******************************************************************
>
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [email protected]
*******************************************************************
