menu "slide" google maps

[fuxio82]

salve a tutti, qualcuno ha idea o può postarmi un tutorial su come realizzare un menu "slide" come quello in maps.google.com ?

sto realizzando il menu per la mia mappa e quella soluzione sarebbe veramente l'ideale...
buonagiornata a tutti.

[Cooly]

qualche esempio ?? cosi vedo cosa intendi..

[fuxio82]

guarda il sito maps.google.com c'è un menu che scompare sulla sinistra. ecco: io vorrei ricreare lo stesso menu (magari che non esca ogni volta)

[Cooly]

<SCRIPT type="text/javascript">
d = document
domW3C = (d.getElementById && d.createElement && d.getElementsByTagName &&
    d.getElementsByTagName("HTML") && d.getElementsByTagName("HTML")[0] &&
    d.getElementsByTagName("HTML")[0].firstChild) ? 1 : 0;
if(domW3C) location = "versioneDOMW3C.html"
else location = "versioneNoDOMW3C.html"
</SCRIPT>

/*DHTML Sliding Menu-[Menu Scorrevole DHTML]-by William Verdolini-w.verdolini@html.it-jesi(italy)-9/2002*/
function Menu(t,U,b,M){this.t=t;this.U=U;this.b=b;this.subMenu=[];this.MFN=M||null}function L(sA,h,g,c){this.c=c||null;this.el=document.createElement("DIV");this.css=this.el.style;if(sA)this.apSA(sA);this.apTL(h);this.RM=null;this.g=g||null;this.el.g=this}function apSA(sA){var st,stV;for(a in sA){st=sA[a].split("=");stV=st[1];if(st.length>2)for(i=2;i<st.length;i++)stV+="="+st[i];this.css[st[0]]=stV}}function apTL(f){if(!f)f=document.getElementsByTagName("BODY").item(0);else if(f.constructor&&f.constructor==L)f=f.el;f.appendChild(this.el)}function writeInL(text){if(this.txt)this.txt.el.firstChild.nodeValue=text;else{var tT=parseInt(this.css.height)-parseInt(this.css.fontSize);if(this.c.ie) 
tT=tT-(parseInt(this.css.borderTopWidth)||parseInt(this.css.borderWidth)||0)-(parseInt(this.css.borderBottomWidth)||parseInt(this.css.borderWidth)||0);tT=tT/2;if(this.c.ie)tT=Math.ceil(tT);this.txt=new L(["position=absolute","left=0px","top="+tT+"px","width=100%","lineHeight=100%"],this.el);this.txt.el.appendChild(document.createTextNode(text))}}function setL(o,RI,RO,cS){this.el.onclick=function(e){if(!this.g.c.going){this.g.c.going=true;if(this.g.g&&this.g.g.constructor==sbL){subW=parseFloat(this.g.c.sub.css.top);this.g.c.Vg=false}if(cS){this.g.apSA(cS);if(o){o.apSA(cS);o.el.onmouseover=null;o.el.onmouseout=null}this.onmouseover=null;this.onmouseout=null}this.g.c.gDI(e)}};this.el.onmouseover=function(){this.g.apSA(RI);if(o)o.apSA(RI)};this.el.onmouseout=function(){this.g.apSA(RO);if(o)o.apSA(RO)}}function adBNS(){var tpB=(parseInt(this.css.borderLeftWidth)||parseInt(this.css.borderWidth)||0)+(parseInt(this.css.borderRightWidth)||parseInt(this.css.borderWidth)||0)
return(tpB)}L.prototype.adBNS=adBNS;L.prototype.setL=setL;L.prototype.apSA=apSA;L.prototype.apTL=apTL;L.prototype.writeInL=writeInL;function sbL(sA,h,wL,c){this.fix=new L(sA,h,this,c);this.dyn=new L(sA,h,this,c);this.dyn.css.width="0px";if(this.FS("borderRightWidth",sA)||this.FS("borderWidth",sA)){if(c.ie)this.fix.css.width=(parseInt(this.fix.css.width)-(parseInt(this.FS("borderRightWidth",sA))||parseInt(this.FS("borderWidth",sA))))+"px";this.fix.css.borderRightWidth="0px"}var offL=(!c.ie&&(this.FS("borderLeftWidth",sA)||this.FS("borderWidth",sA)))?(parseInt(this.FS("borderLeftWidth",sA))||parseInt(this.FS("borderWidth",sA))):0;this.dyn.css.borderLeftWidth="0px";this.dyn.css.left=parseInt(this.fix.css.width)+offL+"px";this.fix.g=this;this.dyn.g=this;this.RM=null;this.g=h||null}sbL.prototype.FS=FS;function ContainerMenu(sM,Hs,Vs,d,lF,bSA,SSA,cSA,sSA,iSSA,oSSA,isSA,osSA,cSSA,csSA){this.ie=(navigator.appName.indexOf("Microsoft")>-1)?1:0;this.sM=sM;this.nM=sM;this.Hs=Hs||10;this.Vs=Vs||1;this.d=(d!=null)?d:500;this.LFN=lF||"no";this.boxS=bSA;this.supS=SSA;this.cenS=cSA;this.subS=sSA;this.inSup=iSSA;this.outSup=oSSA;this.inSub=isSA||this.inSup;this.outSub=osSA||this.outSup;this.ckSup=cSSA||null;this.ckSub=csSA||null;this.w=parseInt(this.FS("width",this.supS))||100;this.h=parseInt(this.FS("height",this.subS))||15;this.prg=this.h;if(!this.ie){this.wSR=this.NSBM("width",this.supS);this.wcR=this.NSBM("width",this.cenS);this.wsR=this.NSBM("width",this.subS);this.supS[this.supS.length]="width="+this.wSR+"px";this.cenS[this.cenS.length]="width="+this.wcR+"px";this.subS[this.subS.length]="width="+this.wsR+"px";this.hSR=this.NSBM("height",this.supS);this.hcR=this.NSBM("height",this.cenS);this.hsR=this.NSBM("height",this.subS);this.supS[this.supS.length]="height="+this.hSR+"px";this.cenS[this.cenS.length]="height="+this.hcR+"px";this.subS[this.subS.length]="height="+this.hsR+"px"}this.box=new L(this.boxS,null,this,this);this.sup=new L(null,this.box,this.box,this);this.SI=[];this.Ce=new L(this.cenS,this.box,this.box,this);var tpAr=["position=absolute","width="+(!this.ie?this.wcR:this.w)+"px","height="+(!this.ie?this.hcR:this.h)+"px","top=0px","left=0px","fontSize="+(parseInt(this.FS("fontSize",this.cenS)))+"px","borderTopWidth="+(parseInt(this.FS("borderTopWidth",this.cenS))||parseInt(this.FS("borderWidth",this.cenS))||0)+"px","borderBottomWidth="+(parseInt(this.FS("borderBottomWidth",this.cenS))||parseInt(this.FS("borderWidth",this.cenS))||0)+"px"];this.cSL=new L(tpAr,this.Ce,this.Ce,this);this.ccL=new L(tpAr,this.Ce,this.Ce,this);this.ccL.writeInL(this.sM.t);this.csL=new L(tpAr,this.Ce,this.Ce,this);this.sub=new L(["position=absolute","top="+(this.h)+"px","left=0px"],this.box,this,this);this.sub.cT=-this.h;this.sIt=[];this.sub.RM=this.sM;this.Ce.css.clip="rect(0px 1000px "+this.h+"px 0px)";this.Ce.css.top=this.h+"px";this.Ce.css.zIndex="2";this.cSL.css.top="-"+this.h+"px";this.ccL.css.top="0px";this.csL.css.top=this.h+"px";this.Vg=false;this.tO=true}function FS(sT,sA){var st,rt;for(a in sA){st=sA[a].split("=");if(st[0].toLowerCase()==sT.toLowerCase())rt=st[1]}return rt||null}function HS(Cd){var tpW,FiW;ref=this;cl=Cd||null;tpW=parseInt(this.Ce.css.width)+(!this.ie?this.Ce.adBNS():0);FiW=this.tO?(this.fixedWidth)?this.fixedWidth:((this.nM.subMenu.length||1)*this.w):this.w;var prgStep=this.tO?this.Hs:-this.Hs;
if(this.tO&&tpW<FiW||!this.tO&&tpW>FiW){if(!this.tO&&this.sup.el.firstChild&&(parseInt(this.sup.el.firstChild.style.left)+this.w)>=tpW)this.sup.el.firstChild.style.left=(tpW-this.w+prgStep)+"px";this.Ce.css.width=(parseInt(this.Ce.css.width)+prgStep)+"px";if(this.subSliding){for(i=0;i<this.sIt.length;i++){var bW=this.sIt[i].dyn.css.borderRightWidth?(!this.ie)?0:parseInt(this.sIt[i].dyn.css.borderRightWidth):0;this.sIt[i].dyn.css.width=Math.abs((tpW-this.w+bW+prgStep))+"px"}}setTimeout("ref.HS(cl)",this.minCPUres)}else{this.Ce.css.width=FiW-(!this.ie?this.Ce.adBNS():0)+"px";if(this.subSliding){for(i=0;i<this.sIt.length;i++){var bW=this.sIt[i].dyn.css.borderRightWidth?(!this.ie)?0:parseInt(this.sIt[i].dyn.css.borderRightWidth):0
this.sIt[i].dyn.css.width=FiW-this.w+bW+"px"}}if(this.sup.el.firstChild)this.sup.el.firstChild.style.left="0px";if(this.tO)this.uSM(this.supS);else{if(this.sup.el.firstChild){this.sSL(false);setTimeout("ref.uD()",this.d)}else{if(!cl)setTimeout("ref.gUsIt()",this.d)}}this.tO=this.tO?false:true}}function uSM(SSA){this.going=true;this.adI(SSA);this.slI(true)}function adI(sA){this.SI.length=this.nM.subMenu.length;for(i=0;i<this.nM.subMenu.length;i++){this.SI[i]=new L(this.supS,this.sup,this.sup,this);this.SI[i].writeInL(this.nM.subMenu[i].t);this.SI[i].RM=this.nM.subMenu[i];this.SI[i].css.left=(i*this.w)+"px";this.SI[i].setL(null,this.inSup,this.outSup,this.ckSup)}}function gUsIt(){ref=this;if(subW>=this.sIt[this.sub.sIx].subTop+this.h){if((subW-this.Vs)<=this.sIt[this.sIt.length-1].subTop){this.sub.el.removeChild(this.sIt[this.sIt.length-1].fix.el);this.sub.el.removeChild(this.sIt[this.sIt.length-1].dyn.el);this.sIt.length--}subW-=this.Vs;this.sub.css.top=subW+"px";setTimeout("ref.gUsIt()",this.minCPUres)}else{this.sub.css.top=(this.sIt[this.sub.sIx].subTop+this.h)+"px";this.sSL(true);ref.uD()}}function gDI(e){if(!e)e=window.event;source=e.srcElement?e.srcElement:e.target;while(source.tagName!="DIV"||source.firstChild&&source.firstChild.nodeType==3)source=source.parentNode;for(i=0,j=0;i<this.SI.length;i++,j++){if(this.SI[i]==source.g)j--;else this.SI[j]=this.SI[i]}this.SI.length=j;for(i=0;i<this.sIt.length;i++){if(this.sIt[i]==source.g.g)this.sub.sIx=i}this.prg=0;this.slI(false)}function slI(up,Cd){ref=this;rec=up;cl=Cd||null;this.prg+=(up)?-this.Vs:this.Vs;if(rec&&this.prg>=0||!rec&&this.prg<=this.h){for(j=0;j<this.SI.length;j++)this.SI[j].css.top=this.prg+"px";setTimeout("ref.slI(rec,cl)",this.minCPUres)}else{if(!up){for(j=0;j<this.SI.length;j++)this.sup.el.removeChild(this.SI[j].el);setTimeout("ref.HS("+(cl?'true':'')+")",this.d)}else 
this.going=false}}function sSL(gU){var sIx=this.sIt.length;if(!gU&&this.nM.b)this.ssIL(sIx,this.nM);slLe=[];vl=[];var actInd,doLe=(this.sup.el.firstChild&&this.sup.el.firstChild.g.txt)?this.sup.el.firstChild.g.txt:null;slLe.length=0;actInd=slLe.length;slLe[slLe.length]=this.cSL;if(!gU)slLe[actInd].writeInL(doLe.el.firstChild.nodeValue);slLe[slLe.length]=this.ccL;actInd=slLe.length;slLe[slLe.length]=this.csL;if(gU)slLe[actInd].writeInL(this.sIt[this.sub.sIx].fix.RM.t);if(!gU)slLe[slLe.length]=this.sup.el.firstChild.g;if(!gU&&this.nM.b||gU)slLe[slLe.length]=this.sub;for(j=0;j<slLe.length;j++)vl[j]=parseInt(slLe[j].css.top);this.Vg=(!gU)?true:false;this.prg=0}function uD(){ref=this;this.prg+=this.Vs;if(this.prg<this.h){for(j=0;j<slLe.length;j++)slLe[j].css.top=(this.Vg)?(vl[j]+this.prg)+"px":(vl[j]-this.prg)+"px";setTimeout("ref.uD()",this.minCPUres)}else{for(j=0;j<slLe.length;j++)slLe[j].css.top=(this.Vg)?(vl[j]+this.h)+"px":(vl[j]-this.h)+"px";this.sub.cT+=(this.Vg)?-this.h:+this.h;if(this.Vg){this.csL.css.top=(parseInt(this.csL.css.top)-(this.h*3))+"px";var tmp1=this.cSL;var tmp2=this.ccL;this.cSL=this.csL;this.ccL=tmp1;this.csL=tmp2;}else{this.cSL.css.top=(parseInt(this.cSL.css.top)+(this.h*3))+"px";var tmp1=this.csL;var tmp2=this.ccL;this.csL=this.cSL;this.ccL=tmp1;this.cSL=tmp2;}this.nM=(this.Vg)?this.sup.el.firstChild.g.RM:this.sIt[this.sub.sIx].fix.RM;if(this.sup.el.hasChildNodes())this.sup.el.removeChild(this.sup.el.firstChild);if(!this.Vg){this.sub.el.removeChild(this.sIt[this.sub.sIx].fix.el);this.sub.el.removeChild(this.sIt[this.sub.sIx].dyn.el);this.sIt.length=this.sub.sIx}if(this.nM.MFN){if(this.nM.MFN!="no")window[this.nM.MFN](this.nM.U)}else if(this.LFN){if(this.LFN!="no")window[this.LFN](this.nM.U)}this.HS()}}function ssIL(ix,RM){this.sIt[ix]=new sbL(this.subS,this.sub,this.w,this);this.sIt[ix].fix.css.top=(-this.h*ix)+"px";this.sIt[ix].dyn.css.top=(-this.h*ix)+"px";this.sIt[ix].subTop=parseInt(this.sub.css.top);this.sIt[ix].fix.writeInL(RM.t);if(this.ie)this.sIt[i].dyn.writeInL("");this.sIt[ix].fix.RM=RM;this.sIt[ix].dyn.RM=RM;this.sIt[ix].fix.setL(this.sIt[ix].dyn,this.inSub,this.outSub,this.ckSub);this.sIt[ix].dyn.setL(this.sIt[ix].fix,this.inSub,this.outSub,this.ckSub)}function initialSubItemsL(V){for(i=0;i<V.length;i++){this.ssIL(i,V[i]);this.sub.css.top=((i+2)*this.h)+"px"}}function NSBM(IEdim,sA){var wh=(IEdim=="width")?[this.w,"Left","Right"]:[this.h,"Top","Bottom"];var tmpMeasure=wh[0]-(parseInt(this.FS("border"+wh[1]+"Width",sA))||parseInt(this.FS("borderWidth",sA))||0)-(parseInt(this.FS("border"+wh[2]+"Width",sA))||parseInt(this.FS("borderWidth",sA))||0);return(tmpMeasure)}function closeMenu(){this.slI(false,true)}ContainerMenu.prototype.subSliding=true;ContainerMenu.prototype.fixedWidth=null;ContainerMenu.prototype.minCPUres=10;ContainerMenu.prototype.open=HS;ContainerMenu.prototype.close=closeMenu;ContainerMenu.prototype.ssIL=ssIL;ContainerMenu.prototype.gUsIt=gUsIt;ContainerMenu.prototype.NSBM=NSBM;ContainerMenu.prototype.initialSubItemsLevel=initialSubItemsL;ContainerMenu.prototype.FS=FS;ContainerMenu.prototype.HS=HS;ContainerMenu.prototype.adI=adI;ContainerMenu.prototype.slI=slI;ContainerMenu.prototype.gDI=gDI;ContainerMenu.prototype.sSL=sSL;ContainerMenu.prototype.uSM=uSM;ContainerMenu.prototype.uD=uD

<SCRIPT type="text/javascript" src="slidingMenu.js"></SCRIPT>

[fuxio82]

ehm... ringrazio moltissimo il tuo aiuto, ma non c'ho capito molto:
copio il codice dentro un unico file?

ho fatto così, ma mi dice che il file "versioneDOMW3C.html" non è stato trovato sul server...

[fuxio82]

ehm, qualcuno che mi aiuta ad interpretare il codice???