For security concern, many users like to disable JavaScript in their web browser, and it raise a big problem in many website which depends on JavaScript to function well. The easy and simple solution is using the HTML “noscript” tag to display different content if JavaScript is disabled.
See following full “noscript” example :
- If JavaScript is disabled : Display warning message and hide the entire content with CSS.
- If JavaScript is enabled : Fine, do nothing.
<html>
<head></head>
<body>
<h1>noscript example</h1>
<noscript>
<h2>JavaScript is disabled! Why you want to do so?
Please enable JavaScript in your web browser!</h2>
<style type="text/css">
#main-content { display:none; }
</style>
</noscript>
<div id="main-content">
<h2>Welcome, JavaScript user, i like web browser with JavaScript enabled!</h2>
</div>
</body>
</html>
Demo
Figure 1 : Web browser with JavaScript disabled.
Figure 2 : Web browser with JavaScript enabled.
Note
Many ask, how can i enable the JavaScript in client’s web browser? The answer is : there is no way to enable JavaScript without the client interaction, just forger about it.
Many ask, how can i enable the JavaScript in client’s web browser? The answer is : there is no way to enable JavaScript without the client interaction, just forger about it.
Download Source Code
Download it – noscript-example.zip(1 KB)
You have to move “#main-content { display:none; }” to another within the HEAD section to get W3C Nu Html Checker successful validation.
Simple, and brilliant!
its nice.but i want to execute script which belongs to click button eg. addToCart button in Lambda tek site
This can be hacked with firebug in about 3 seconds. Dynamically change the id name of the div containing the “welcome js user..” and your “hidden” content appears.
Perfect solution. This is exactly what I was looking for. Thank you!
Thanks for the script.
Just thought id add my own solution. I have javascript controlled divs and on a browser where javascript is disabled, none of these are shown…so:
1. Have a standard div in centre of page saying “please enable javascript to view or click here for non javascript page”
2. Set the z-value to -1
3. Have all javascript controlled divs set with a white/whatever background and a z-value of 0 or higher
The javascript controlled divs will cover the message if enabled, and show it if not.
Hope that this gives one or two of you a few ideas. Although this was specifically for my site, you may find that thinking out the box may help you too.
Thanx for the script….i wanted to know, is there a way to automatically refresh the browser window or redirect, when the user disables javascript on arriving at a particular page which requires javascript ?
I m asking this because the above code only shows the disabled javascript note when the window is refreshed.
I am also facing same problem
Thanx for the script….i wanted to know, is there a way to automatically refresh the browser window or redirect, when the user disables javascript on arriving at a particular page which requires javascript ?
I m asking this because the above code only shows the disabled javascript note when the window is refreshed.
You can use meta redirect