Block access to the site if javascript is disabled

Majority of modern web sites, especially with responsive feature, make a large use of javascript for allow various objects to be managed correctly in each situation. Sometime can happen user have javascript disabled in the browser and the web site will not work as expected with the result of a bad user experience. Here  a simply solution for advise user about javascript problem and block access to the site until javascript enabled.

The trick is quite simple. HTML have a special tag called <noscript> executed by the browser if javascript is disabled. Usually this is used to show a warning message advising the user javascript enabled is required by the web site. However, in this example, an additional semi-transparent frame will be added for block access to the site by doesn't allow interaction with any of the objects below.

CSS style

<style>
.js_disabled_frame {
position:fixed;
background-color:rgba(242,242,242,0.95); 
z-index:100000;
width:100%;
height:100%;
}
.js_disabled_frame #js_warning_msg {
position: absolute;
width: 60%;
height: 30%;
left: 20%;
top: 30%;
text-align: center;
margin: 0 auto;
font-size: x-large;
}
</style>

HTML code

<noscript class="js_disabled_frame">
   <div id="js_warning_msg">
     <b style="color:#FF0000">Javascript is disabled!</b>
  </div>
</noscript>

The code is very simple, you can directly copy and past to your site, just some explanation as clarification of some points. The CSS tag z-index set to a very high value ensure this frame will be placed on top of other page elements (for avoid interaction) and the position set to fixed will lock the frame always on browser visible area also if user scroll the page content. The way to center the js_warning_msg text on the center of the screen is not very elegant and exist some other ways to make a better result. However this simply code ensure compatibility to all browsers, in case you want to  use some "modern" way you have to check if the solution working on he same way to all available desktop and mobile browser, choice is up to you.