Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations gkittelson on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Conditional CSS include based on <script> <noscript> 2

Status
Not open for further replies.
entidi

entidi

Programmer
Sep 18, 2007
6
IT
Hi all,

I implemented a hierarchy browser using javascript when available. Whithout javascript, I wanted a full-expanded menu.
I solved with the following code:

<link rel="stylesheet" type="text/css" ref="style.css"></link>
<noscript>
<link rel="stylesheet" type="text/css" href="style_nojs.css"></link>
</noscript>

It conditionally includes a specific stylesheet when javascript is not found. It works well, but there it is no XHTML1.0 compliant (<link> cannot be buried inside <noscript>).

Any idea or suggestion?
Thankyou in advance...

Implementation:
 
Sort by date Sort by votes
Easy, have javascript write out the link rel of the style sheet you want included when javascript is present. and have the no JS hard coded into the page above.

If there is no JS available. the stylesheet can't get written out. but if there is, it will override the no js stylesheet as long as it comes after it.


Code: 
 <link rel="stylesheet" type="text/css" href="style_nojs.css"></link>
<script>
document.write('<link rel="stylesheet" type="text/css" ref="style.css"></link>');
</script>


----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
Upvote 0 Downvote
you could include your non-js style as default and write over your it to include your js style when js is available.
 
Upvote 0 Downvote
Because <noscript> cannot be inside <head>, I was thinking also <script> cannot be used.
Checking the w3c documentation carefully, I discovered I was wrong: what a stupid question...

Thank you for your help!
 
Upvote 0 Downvote
Instead of using JS to link another stylesheet, why not use it to append a class to the body element?

That way, you can specify an alternate set of rules that use this class in the same stylesheet.



--
Tek-Tips Forums is Member Supported. Click Here to donate

<honk>*:O)</honk>

Tyres: Mine's a pint of the black stuff.
Mike: You can't drink a pint of Bovril.

 
Upvote 0 Downvote
It sounds good: this way I can encapsulate all the js specific customizations in support.js. The problem is that, apart js is a scripting language in the client side, I don't know ANYTHING about ecma scripting.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

jizzer
  • Locked
  • Question
HTML/CSS Image map with multiple tool-tips
Replies
3
Views
1K
spamjim
spamjim
Expoverse
  • Locked
  • Helpful tip
Solution to CSS Two Level Horizonal Menu 1
Replies
1
Views
730
pmonett
pmonett
cae154
  • Locked
  • Question
Body of email not appearing in correct font on iPhone and iPad
Replies
1
Views
758
spamjim
spamjim
PeDa
  • Locked
  • Question
CSS two level horizontal menu
Replies
0
Views
585
PeDa
PeDa
lmcate
  • Locked
  • Question
From HTML Page open an MDB files on the server and work
Replies
0
Views
203
lmcate
lmcate

Part and Inventory Search

Sponsor

Back
Top