Link to home
Start Free TrialLog in
Avatar of jackjohnson44

asked on

scriptlet hide everything but div

I want to have a bookmark so when I click on it, everything hides except what is in the div with the id pageContainer.  This is for a news site.  Basically I want to hide the surrounding area except the main body area.
Avatar of roxviper
Flag of Romania image

Avatar of Samuel Liew
Samuel Liew
Flag of Australia image

Link to home
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
<a href="#" onclick="showDiv('pageContainer');">
should be
<a href="#" onclick="showDiv('pageContainer');return false;">

and also please check for any script errors.
There's nothing wrong with that, but since you insist, here's the updated code.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "">
<html xmlns="">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
* {
   font-size: 18px;
   font-family: Calibri, Arial, Verdana;
#pageContainer {
   border: 1px solid red;
   padding: 10px;
<script type="text/javascript">
function showDiv(divId) {
        var all = document.getElementsByTagName("*");
        for(i=0;i<all.length;i++) {
                        all[i].style.display = "none";
        var elem = document.getElementById(divId);
        do { = "block"; } while(elem = elem.parentNode);

<p>Some Text</p>
<p>Some Text</p>
<div id="pageContainer">Text in div pageContainer</div>
<p><a href="#" onclick="showDiv('pageContainer'); return false;">This bookmark hides display of everything other than pageContainer</a></p>
<p>Some Text</p>
<p>Some Text</p>

Open in new window

No offense.
I always use return false for it not to evaluate to href which is the default behavior.
Your script still has errors, at least I got it in IE 8 and FF.
So pointed them out.

No points for me, glad to help a lending hand.

Avatar of jackjohnson44