This seems possible with vanilla javascript (IE6 does not crash).
// Vanilla Javascript -- works in IE6
var link = document.createElement('link');
link.type = 'text/css';
link.href = 'foo.css';
link.rel = 'stylesheet';
link.media = 'screen';
document.getElementsByTagName('head')[0].appendChild(link);
Any ideas why the jQuery way is crashing IE6?
--
Hector
On Mon, Jul 20, 2009 at 11:47 AM, Hector Virgen <djvir...@gmail.com> wrote:
> I am building a page that loads a css file through javascript. To help
> prevent "flash of unstyled content"[1], I am loading the CSS file as early
> as possible (before document.ready()). I am using jQuery 1.3.2.
> In Firefox 3.5.1 and Chrome 2.0.172.37 this is working properly, but in IE6
> the browser crashes (not just a javascript error, but a full-blown crash).
>
> I've narrowed it down to this bit of code that reproduces the problem:
>
> <script type="text/javascript">
> var link = $('<link></link>');
> link.attr({
> href: 'foo.css',
> rel: 'stylesheet'
> });
> </script>
>
> After some more testing I found that if I remove the "rel" attribute *or*the
> "href" attribute, the script runs fine and IE6 won't crash. It's only
> when I use both of them together.
>
> Are there alternatives to loading stylesheets on-demand, perhaps something
> similar to $.getScript()? Thanks!
>
> 1. http://en.wikipedia.org/wiki/Flash_of_unstyled_content
>
> --
> Hector
>
