So our mobile website is getting a FOUC on load and any page click. Site is m.whitewatertours.com and it happens any time an external css is added to the <head>, code here:
<link rel="stylesheet" href="twt_mobile.css">
I've tried several things like:
1) adding <script type="text/javascript"></script> right before my <link...> (mentioned in this post: http://forums.adobe.com/message/3800999#3800999) - this did nothing
2) replaced <link...> with
<link rel="stylesheet" type="text/css" media="print" href="print.css">
<style type="text/css" media="screen">@import "twt_mobile.css";</style>
as suggested on this website: http://www.bluerobot.com/web/css/fouc.asp/ - still did not help
3) adding the css as an import - looks like this:
<style type="text/css">
@import url("twt_mobile.css");
</style> - did not help
4) I read this page 2X and it is beyond my comprehension what needs to be done:
http://www.learningjquery.com/2008/10/1-way-to-avoid-the-flash-of-unst yled-content
Appreciate any insight on the matter!
Thanks, Jenny