GerryH Posted November 16, 2009 Share Posted November 16, 2009 Sorry to be asking silly questions, but I think I'm going to have a brain tumor if I keep Googling this. :Wink; Simply what I'm trying to do is load a style sheet if the brower has javascript disabled. <head> ... <link href="normal.css" rel="stylesheet" type="text/css" /> <noscript><link href="nojavascript.css" rel="stylesheet" type="text/css" /></noscript> </head> Now this works fine with IE, FF, Opera, Safari, and Chrome, however it fails the validation with the error that the <noscript> tag is not allowed in the <head>. Is there another method to accomplish this? FWIW setting the classes with javascript setAttribute("class", "nojavascript"), and setAttribute("className, "nojavascript"), works for the most part, except when a class has been overridden. For example if the "normal.css" contained the class; .p1:link {background: transparent url('buttons.png') 0px 0px no-repeat;}.p1:visited {background: transparent url('buttons.png') 0px 0px no-repeat;}.p1:focus {background: transparent url('buttons.png') 0px -32px no-repeat;}.p1:hover {background: transparent url('buttons.png') 0px -32px no-repeat;}.p1:active {background: transparent url('buttons.png') 0px -32px no-repeat;} Now without any other class declarations, then the setAttribue() works perfect. However if I override this class with my "nojavascript.css" and redefine my "p1" class, .p1:link {background: transparent url('buttons.png') -0px -64px no-repeat;}.p1:visited {background: transparent url('buttons.png') 0px -64px no-repeat;}.p1:focus {background: transparent url('buttons.png') 0px -64px no-repeat;}.p1:hover {background: transparent url('buttons.png') 0px -64px no-repeat;}.p1:active {background: transparent url('buttons.png') 0px -64px no-repeat;} Then the setAttribue() fails and the state of the background remains as the "nojavascript.css" declaration.I know this is a combo-problem with js and css, however I posted in this forum hoping there's anwser in the markup.Thanks! Link to comment Share on other sites More sharing options...
dsonesuk Posted November 17, 2009 Share Posted November 17, 2009 use javascript to disable the nojavascript.css, if javascript is disabled, it will become active.<script type="text/javascript">/*<![CDATA[*//*---->*/ var lnktag = document.getElementsByTagName("link"); lnktagtotal = lnktag.length; for(i=0;i<lnktagtotal;i++) { str=lnktag.href; if(str.indexOf("nojavascript.css")!=-1) { lnktag.disabled=true; } }/*--*//*]]>*/</script> Link to comment Share on other sites More sharing options...
GerryH Posted November 17, 2009 Author Share Posted November 17, 2009 A million thank you's!!!! Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.