Honesty Rocks! truth rules.

Document.write & Noscript Questions (javascript)

HOME      >>       Programming

gaea

I am trying to use javascript to include a stylesheet depending on the user's resolution.

 

The HTML

<head> <meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" /> <?php if ($my->id) { initEditor(); } ?> <?php mosShowHead(); ?> <noscript><link type="text/css" href="highimpactart.org/templates/_HighImpactArt_/1024/1024.css&%2334; /></noscript> <script type="text/javascript"> if (screen.width>=1050) { document.write('<link type="text/css" href="highimpactart.org/templates/_HighImpactArt_/1280/1280.css&%2334; />'); } </script> </head>

I'm running into two problems.

 

1) The script doesn't seem to be writing anything. Fixed

2) The <noscript> tags cause all sorts of validation errors. From what I've read it seems as though the <noscript> tag is not allowed within the <head> section -- is this correct? Could the same thing be accomplished just putting the default stylesheet above the javascript? The 1280 stylesheet has the same exact classes as the 1024 stylesheet, so would that over ride it?

3) The Validator doesn't like the fact that I have a "link" element inside the javascript code. Any suggestions about how to fix it? Evidently xhtml doesn't play nice with javascript by default. You need to add in two extra lines.

 

Ie:

<script type="text/javascript">/*<![CDATA[*/ YourJavaScriptCodeHere/*]]>*/</script>

Thank you for your time.


rvalkass

2) The <noscript> tags cause all sorts of validation errors. From what I've read it seems as though the <noscript> tag is not allowed within the <head> section -- is this correct? Could the same thing be accomplished just putting the default stylesheet above the javascript? The 1280 stylesheet has the same exact classes as the 1024 stylesheet, so would that over ride it?

The noscript element can only go in the body, as either an inline or block level element. Stylesheets do cascade, meaning that a second stylesheet will overwrite the first. You could therefore always include the 1024 stylesheet, and just use JS to put in the 1280 stylesheet if necessary.

 

3) The Validator doesn't like the fact that I have a "link" element inside the javascript code. Any suggestions about how to fix it? Evidently xhtml doesn't play nice with javascript by default. You need to add in two extra lines.

 

Ie:

<script type="text/javascript">/*<![CDATA[*/

YourJavaScriptCodeHere

/*]]>*/</script>

Thank you for your time,

~Paolo


You shouldn't have the /* in your code there. It should just be:

<script type="text/javascript"><![CDATA[ Some JS here...]]></script>


minimcmonkey

One way of getting around a noscript error, is by making PHP detect whether the browser is JavaScript enabled. That way, if it is, you can output a script, if it isn't, you can output a menu, which allows the user to choose which resolutions stylesheet to use, including an option to display a sylesheet which will work for most monitors in case the user doesn't know. This also helps if the user has a firewall which stops websites from collecting computer information, as you can assume that if PHP cant find out the monitor resolution, either can javascript, and then just output the manual change menu.