How to keep setting of a show/hide sidebar
<p>I made a sidebar it is meant to show all time, only when it is clicked it will hide. But after hiding this if I refresh the page it get shown again. So I want to keep settings so if user hide this it wont appear until he press the show button doesnt matter the page refresh or he goto another page. </p>

<p><em>(For example like facebook right chatbar which stays hidden or shown doesnt matter the page refresh or anything)</em></p>

<p>I guess some changes on JS will do the job but im not sure &amp; not a coder so help me do it.</p>

<p><strong>the JS code I used:</strong></p>

<pre><code>&lt;script language=javascript type='text/javascript'&gt;
function hideDiv() {
    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById('hideShow').style.visibility = 'hidden';
    } else {
        if (document.layers) { // Netscape 4
            document.hideShow.visibility = 'hidden';
        } else { // IE 4
            document.all.hideShow.style.visibility = 'hidden';
        }
    }
}

function showDiv() {
    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById('hideShow').style.visibility = 'visible';
    } else {
        if (document.layers) { // Netscape 4
            document.hideShow.visibility = 'visible';
        } else { // IE 4
            document.all.hideShow.style.visibility = 'visible';
        }
    }
}
&lt;/script&gt;
</code></pre>

<p>HTML and CSS</p>

<pre><code>&lt;div id="hideShow" ..etc&gt;
    My content
&lt;/div&gt;
</code></pre>

<p>and this to call the JavaScript to hide it:</p>

<pre><code>&lt;a href="javascript:hideDiv()"&gt;Hide Div&lt;/a&gt;
</code></pre>

<p>and this to show it:</p>

<pre><code>&lt;a href="javascript:showDiv()"&gt;show Div&lt;/a&gt; 
</code></pre>
