Ciao a tutti

ho scaricato tempo fa un menu verticale espandibile in css. Il problema è che non capisco come tenere aperti i sottomenu al refresh di una pagina oppure al cambio pagina.
L'unica soluzione che ho pensato è quella di utilizzare i frames....ma preferirei trovarne ancora se possibile.
Vi posto il codice
codice:
//js
var prev="null";
window.onload=function(){
if(document.getElementsByTagName && document.getElementById){
    document.getElementById("nav").className="jsenable";
    BuildList();
    }
}
function BuildList(){
var hs = document.getElementById("nav").getElementsByTagName("h3");
for(var i=0;i<hs.length;i++){
    hs[i].onclick=function(){
        if(this.parentNode.className!="show"){
            this.parentNode.className="show";
            if(prev && prev!=this.parentNode) prev.className="hide";
            prev=this.parentNode;
            }
        else this.parentNode.className="hide";
        }
    }
}
codice:
/*css del menu*/
div#nav{width:170px;margin-left: 10px;background: #00005A;
    border: 1px solid #00005A; font: 11px Arial, Helvetica, sans-serif}
div#nav h3{font-size: 100%;margin: 0;padding: 4px 10px;
    border-top: 1px solid #FFF;color: #000;background-color: #7BA5E7}
div#nav ul,div#nav li{margin: 0;padding: 0;list-style-type: none}
div#nav li{margin: 0 0 1px 0}
div#nav a{display: block;padding-left: 15px;height: 18px;line-height: 18px;
    border-top: 1px solid #FFF;background-color: #BDBDBD;color: #000;
    text-decoration: none;font-weight: bold}
div#nav a:hover{color: #00005A;background-color: #0099FF}
/*div#nav a:hover{color: #000000;background-color: #0099FF}*/
div#nav ul ul a{color: #333; background-color: #AECDFF;font-weight: normal}
codice:
<div id="nav">
<ul>[*]Home Page[*]<h3>Contenuti e Web Writing</h3>
        <ul>[*]Web Writing[/list]
    [*]<h3>Grafica</h3>
        <ul>[*]Teoria Grafica[*]Corel Draw[/list]
    [/list]
</div>
Come potrei fare?