EN
HTML - detect if JavaScript is disabled
4
points
In this short article, we would like to show how to detect if JavaScript is disabled / blocked.
Quick solution:
<!doctype html>
<html>
<body>
<noscript>
If you see this text it means the JavaScript is disabled.
</noscript>
</body>
</html>
Where
<noscript>
content will be displayed only if JavaScript is disabled or not available.
Screenshot:
Dirask message
In this section, you can find message displayed on Dirask when JavaScript is disabled.
<!doctype html>
<html>
<head>
<style>
body {
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
}
div.message-block {
padding: 14px 20px;
border: 1px solid #d4bc08;
border-radius: 7px;
background: #f7df1d;
text-align: center;
line-height: 36px;
color: #212121;
}
div.message-title {
font-size: 18px;
}
span.message-marker {
font-weight: 500;
}
div.message-description {
font-size: 14px;
}
</style>
</head>
<body>
<noscript>
<div class="message-block">
<div class="message-title"><span class="message-marker">JavaScript</span> is disabled!</div>
<div class="message-description">to use the site features enable it.</div>
</div>
</noscript>
</body>
</html>
Note: to see the effect, copy source code into your website and disable JavaScript.
Screenshot: