Is there a way to detect via JavaScript if CSS is enabled? Simply put what I want to do is stop a default load action if CSS is disabled so that the result cannot ruin the "beauty" of the page. E.g. IMG tag starts with blank.gif as SRC and when page loads SRC is changed to randomly selected URL but if CSS is disabled this makes the page ugly thus the stopping of the action.
http://www.filamentgroup.com/lab/delivering_the_right_experience_to_the_right_device/
http://forums.devshed.com/css-help-116/detecting-browsers-that-do-not-support-css-69067.html
http://www.developertutorials.com/tutorials/css-tutorials/css-browser-detection-050914-1037/
got these in the first 5 google hits. 2 tutorials to choose from
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>css test</title> <style type='text/css'> #nocss {display:none;} </style> </head> <body> css test <div id='nocss'> </div> <script type='text/javascript'> var hasCSS=true; //default is true (98%+) function el(tid) {return document.getElementById(tid);} window.onload= function (){ hasCSS=!el("nocss").offsetWidth; alert("CSS available: "+hasCSS); } </script> </body> </html>
tested in ff3.6
Thanks, I'm going with something like this:
function js.test.css () { var r = false; if (document.all || document.layers || document.getElementById) { var e = js.id(arguments[0]); if (e && e.offsetWidth) { r = true; } } return r; }