Show message if javascript is not enabled in the browser

You can use noscript, inside these tags is what will display if the user has javascript disabled.

If you want to hide the other content if the user doesn't have javascript enabled, you can do something like so (this uses jquery):

<style type="text/css">
    .example {
        display: none;
    }
</style>

<script type="text/javascript">
    $(document).ready(function(){
        $('.example').show();
    });
</script>

<div class="example">
    <p>...</p>
</div>

<noscript>
    <p>You must have javascript enabled for the example div to show!</p>
</noscript>

This will only show the content if the user has javascript enabled.


Use the noscript tag:

<noscript>

  <div class="awesome-fancy-styling">
    This site requires JavaScript. I will only be visible if you have it disabled.
  </div>
  ...
</noscript>

See https://developer.mozilla.org/en/HTML/Element/noscript.


There is never a need to use <noscript> tags with browsers more recent than IE4 and Netscape 4. All that is needed is to use JavaScript to hide anything in the page that you don’t want those with javaScript enabled to see. This is way more flexible than <noscript> since you can actually test for the browser supporting specific JavaScript commands using feature sensing and only hide the HTML when the features that your JavaScript requires to work are actually supported properly by the browser.

<p align=center id=js_disabled_message>
    x.com requires JavaScript Enabled <br> <a href="https://www.enable-javascript.com/">www.enable-javascript.com</a>
</p>
<script>
    document.getElementById('js_disabled_message').style.display = 'none';
</script>

The above code will hide the p tag, only if js is enabled.
It's kinda of the opossite logic to detect if JavaScript is enabled and it works well on all browsers.

SRC