CSS detect browser support javascript

Question

If possibility to checking in CSS detect browser support javascript ? or set other CSS Media Queries for browser not support javascript ?

All browsers support JS. Are you asking to detect if it's turned off? — Paulie_D, Mar 07 '14 at 11:32
css alone doesn't detect if js is turned on. You need to use also js — Fabrizio Calderan, Mar 07 '14 at 11:33
Modernizr.js .no-js .tabs-content > .content {display: block !important;} result: — sebob, Mar 07 '14 at 11:38

score 3 · Answer 1 · edited May 23 '17 at 12:24

You can do it without javascript. You have to use ... HTML !

There is a tag for that : noscript

Summary :

The HTML <noscript> Element defines a section of html to be inserted if a script type on the page is unsupported or if scripting is currently turned off in the browser.

Example :

<noscript>
    <!-- this content will be display if no js -->
</noscript>

In your case, I think you will need something like this :

<noscript>
    <link rel="stylesheet" type="text/css" href="css/nojs.css" />
</noscript>

if you want more info about it, this topic on SO is pretty good.

score 0 · Accepted Answer · answered Mar 07 '14 at 12:24

The common way is to add a class called no-js to your , e.g.

<head class='no-js'>

then as your first line of JS, remove the class.

To keep it simple, in jQuery you'd then write:

$("head").removeClass("no-js");

If you are using plain JS, you need to parse the class attribute and remove just the no-js bit, else if you add further classes later you will wipe them out with a naive approach.

You can then write CSS like:

.message {
    display:none;
}

.no-js .message {
    display:block;
}

If you wanted to show an element with class message only to people with JS disabled.

CSS detect browser support javascript

2 Answers2