Css fallback when JavaScript is disabled

Question

With jQuery Mobile, I use this snippet to call libaries...

<script src="//code.jquery.com/jquery-1.6.4.min.js"></script>
<script>
if(typeof jQuery === 'undefined') 
{
    document.write(unescape('%3Cscript src="js/jquery-1.6.4.min.js"%3E%3C/script%3E'));
    document.write(unescape('%3Cscript src="jqm/jquery.mobile-1.1.0.min.js"%3E%3C/script%3E'));     
    document.write(unescape('%3Clink rel="stylesheet" href="jqm/jquery.mobile-1.1.0.min.css"%3E%3C/script%3E'));
    document.write(unescape('%3Clink rel="stylesheet" href="jqm/jquery.mobile.structure-1.1.0.min.css"%3E%3C/script%3E'));
}
else
{
    document.write(unescape('%3Cscript src="//code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"%3E%3C/script%3E'));
    document.write(unescape('%3Clink rel="stylesheet" href="//code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css"%3E%3C/script%3E'));
    document.write(unescape('%3Clink rel="stylesheet" href="//code.jquery.com/mobile/1.1.0/jquery.mobile.structure-1.1.0.min.css"%3E%3C/script%3E'));
}
</script>

But if JavaScript is disabled, how to call stylesheets?

If I use (I'm a bit stupid!)...

<noscript>
<link rel="stylesheet" href="jqm/jquery.mobile-1.1.0.min.css" />
<link rel="stylesheet" href="jqm/jquery.mobile.structure-1.1.0.min.css" />
</noscript>

... My page is blank.

Thanks for your help.

Vincent

Check your strings and remove trailing %3E%3C/script%3E where it is not needed. But first of all stop using document.write. — VisioN
– VisioN, Commented May 25, 2012 at 17:48
I think this answers your question: stackoverflow.com/questions/3300451/… — woz
– woz, Commented May 25, 2012 at 17:48

Blazemonger · Accepted Answer · 2012-05-25 17:55:23Z

2

The Modernizr approach is to use JavaScript to add a class called "js" to the HTML tag on load, and remove a class called "no-js" which (in this case) you add yourself.

Now, you can add some CSS styles only to descendants of .js and others only to descendants of .no-js, customizing either one to your liking.

answered May 25, 2012 at 17:55

Blazemonger

93.3k28 gold badges147 silver badges181 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Css fallback when JavaScript is disabled

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related