...

View Full Version : hide a div if javascript is disabled?



WebKitty
01-20-2012, 11:56 PM
I have a link to print the page on my site and it relies on javascript being on. So if javascript is disabled, I'd like to not have this div display. How would I do that?

Dom Mv
01-21-2012, 01:19 AM
Place this into the head:



<head>
<script type='text/javascript'>
function displayDiv(){
var link = document.getElementById('js');
link.style.display = 'block';
}
</script>
<noscript>
You need Javascript enabled to view all of the content on this page.
</noscript>
</head>


Place this into the body:



<body onload="displayDiv()">
<div style='display:none;' id='js'>
Content
</div>
</body>

WebKitty
01-21-2012, 01:49 AM
That just made it not show up at all... other suggestions?

Dom Mv
01-21-2012, 02:26 AM
I just tested it again and everything works fine on my end. It should display the 'Content' if Javascript is enabled and 'You need Javascript enabled to view all of the content on this page.' if it isn't.

What happens when you save this as a .html file and open it up with and without Javascript enabled?



<html>

<head>
<script type='text/javascript'>
function displayDiv(){
var link = document.getElementById('js');
link.style.display = 'block';
}
</script>
<noscript>
You need Javascript enabled to view all of the content on this page.
</noscript>
</head>

<body onload="displayDiv()">
<div style='display:none;' id='js'>
Content
</div>
</body>

</html>

WebKitty
01-21-2012, 04:07 AM
Well that worked. Let me try playing with it again...

WebKitty
01-21-2012, 04:11 AM
Ok I got it working. Thanks for your help! :D

felgall
01-21-2012, 04:19 AM
The noscript tag became obsolete a long time ago. Anything you could do with that tag can now be done with far shorter code by using JavaScript. Also you don't need to wrap an entire block of content when you use this option - you can set up JavaScript to hide individual words (<noscript> is a block tag and so can only hide entire blocks). Also you may not just want to hide certain content when JavaScript is disabled, you may want to hide it if the browser doesn't support parts of JavaScript rather than the entire language).


<html>
<head>
<style>
#js {display:none;}
</style>
</head>
<body>
<div id="njs">
Alternate content to allow those without JavaScript enabled to use the page goes here.
</div>
<div id="js">
Content for the JavaScript enabled version of the page goes here
</div>

<script type='text/javascript'>
document.getElementById('js').style.display = 'block';
document.getElementById('njs').style.display = 'none';
</script>
</body>
</html>

Remember to make sure that your page is still functional without JavaScript even if it means reloading web pages a dozen times to achieve the same end result as can be done in one JavaScript enabled page. Most people with JavaScript disabled have done so because enabling JavaScript makes their browser unusable.

jalarie
01-21-2012, 05:14 PM
The noscript tag became obsolete a long time ago. Anything you could do with that tag can now be done with far shorter code by using JavaScript.
Really? How should I do this with far shorter code, and how would it show up if JavaScript is disabled?


<noscript>
<p>You must have scripting enabled to make full use of this page.</p>
</noscript>

felgall
01-21-2012, 10:41 PM
Really? How should I do this with far shorter code, and how would it show up if JavaScript is disabled?
[code]

The code in the post where I said it does exactly that with shorter code than the original. It shows up when JavaScript is disabled because it is a part of the original page content and the JavaScript to hide it can't run.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum