来自GG网站的超酷JS导航代码

答案：<html> 
<head> 
<title>超酷仿GOOGLE首页导航菜单效果</title> 
<meta http-equiv="content-Type" content="text/html;charset=gb2312"> 
</head> 
<body> 
<script> 
window.google={kEI:"HBnlR8bgAorksALn3dTbBw",kEXPI:"17259,17735,18065",kHL:"zh-CN"}; 
function sf(){document.f.q.focus()} 
window.clk=function(b,c,d,e,f,g){if(document.images){var a=encodeURIComponent||escape;(new Image).src="/url?sa=T"+(c?"&oi="+a(c):"")+(d?"&cad="+a(d):"")+"&ct="+a(e)+"&cd="+a(f)+(b?"&url="+a(b.replace(/#.*/,"")).replace(/\+/g,"%2B"):"")+"&ei=HBnlR8bgAorksALn3dTbBw"+g}return true}; 
window.gbar={};(function(){var b=window.gbar,c,g,h;function n(d,f,e){d.visibility=h?"hidden":"visible";d.left=f+"px";d.top=e+"px"}b.tg=function(d){var f=0,e=0,a,i=0,o,l=window.navExtra,m,j=document,k=0;g=g||j.getElementById("gbar").getElementsByTagName("span");(d||window.event).cancelBubble=!i;if(!c){c=j.createElement(Array.every||window.createPopup?"iframe":"DIV");c.frameBorder="0";c.scrolling="no";c.src="#";g[7].parentNode.appendChild(c).id="gbi";if(l&&g[7])for(o in l){m=j.createElement("span");m.appendChild(l[o]);g[7].parentNode.insertBefore(m,g[7]).className="gb2"}j.onclick=b.close}while(a=g[++i]){if(e){n(a.style,e+1,f+25);k=Math.max(k,a.firstChild.tagName=="A"&&a.offsetWidth);f+=a.firstChild.tagName=="DIV"?9:20}if(a.className=="gb3"){do e+=a.offsetLeft;while(a=a.offsetParent)}}{i=0;while(a=g[++i])if(a.className=="gb2")a.style.width=k+"px";c.style.width=k+"px"}c.style.height=f+"px";n(c.style,e,24);h=!h};b.close=function(d){h&&b.tg(d)}})(); 
(function(){ 
function g(a,b,c){var d="on"+b;if(a.addEventListener){a.addEventListener(b,c,false)}else if(a.attachEvent){a.attachEvent(d,c)}else{var e=a[d];a[d]=function(){var f=e.apply(this,arguments),h=c.apply(this,arguments);return f==undefined?h:(h==undefined?f:h&&f)}}};var aa,i,j,l,n="",o,p=null,q=null,r=null,s=-1,t,u,v,w,x=null,y=null,z,A,ba={},B=null,C,F=0,G=0,H=0,I=null,J,K=false,L=false,M,N;{var ca=navigator.userAgent.toLowerCase();M=ca.indexOf("opera")!=-1;N=ca.indexOf("msie")!=-1&&!M}var O=null,da=new RegExp("^[\\s\\u1100-\\u11FF\\u3040-\\u30FF\\u3130-\\u318F\\u31F0-\\u31FF\\u3400-\\u4DBF\\u4E00-\\u9FFF\\uAC00-\\uD7A3\\uF900-\\uFAFF\\uFF65-\\uFFDC]+$"),P="google-ac-",ea=true;function fa(a,b,c,d,e,f,h,m){t=a;u=b;aa=d;O=e;ea=f;if(ga()==null){return}var k=window.google.kHL; 
J=/^(zh-(CN|TW)|ja|ko)$/.test(k);if(c=="search")c="";C="/complete/search?hl="+k+(c?"&ds="+c:"")+(m?"&pq="+ha(m):"")+(h?"&expid="+h:"")+"&client=suggest";t.onsubmit=ia;u.setAttribute("autocomplete","off");g(u,"blur",ja);g(u,"beforedeactivate",ka);if(u.addEventListener){u.onkeypress=la;u.onkeyup=na}else{g(u,N?"keydown":"keypress",la);g(u,"keyup",na)}j=(l=(i=u.value));o=oa(u);v=document.createElement("table");v.id="completeTable";v.cellSpacing=(v.cellPadding="0");w=v.style;v.className=P+"m";Q();document.body.appendChild(v); 
if(N){x=document.createElement("iframe");y=x.style;x.id="completeIFrame";y.zIndex="1";y.position="absolute";y.display="block";y.borderWidth=0;document.body.appendChild(x)}R();pa("",[],[]);qa();g(window,"resize",R);g(window,"pageshow",ra);if(J)window.setInterval(sa,10);z=ta("aq","f",false);A=ta("oq","",true);S()}function ra(a){if(a.persisted)z.value="f";A.value=""}function qa(){var a=document.body.dir=="rtl",b=a?"right":"left",c=a?"left":"right",d=document.getElementsByTagName("head")[0],e=document.createElement("style"),f=null,h=null,m=false;if(document.styleSheets){d.appendChild(e);m=true;f=e.sheet?e.sheet:e.styleSheet}if(!f){h=document.createTextNode("");e.appendChild(h)}var k=function(D,E){var ma=D+" { "+E+" }";if(f){if(f.insertRule){f.insertRule(ma,f.cssRules.length)}else if(f.addRule){f.addRule(D,E)}}else{h.data+=ma+"\n"}};k("."+P+"m","font-size:13px;font-family:arial,sans-serif;cursor:default;line-height:17px;border:1px solid black;z-index:99;position:absolute;background-color:white;margin:0;");k("."+P+"a","background-color:white;");k("."+P+"b","background-color:#36c;color:white;");k("."+P+"c","white-space:nowrap;overflow:hidden;text-align:"+b+";padding-"+b+":3px;"+(N||M?"padding-bottom:1px;":""));k("."+P+"d","white-space:nowrap;overflow:hidden;font-size:10px;text-align:"+c+";color:green;padding-"+b+":3px;padding-"+c+":3px;");k("."+P+"b td","color:white;");k("."+P+"e td","padding:0 3px 2px;text-align:"+c+";font-size:10px;line-height:15px;");k("."+P+"e td","color:blue;text-decoration:underline;cursor:pointer;"); 
if(!m)d.appendChild(e)}function R(){if(v){w.left=ua(u,"offsetLeft")+"px";w.top=ua(u,"offsetTop")+u.offsetHeight-1+"px";w.width=u.offsetWidth+"px";if(x){y.left=w.left;y.top=w.top;y.width=w.width;y.height=v.offsetHeight+"px"}}}function T(a,b){a.visibility=b?"visible":"hidden"}function ta(a,b,c){var d=document.createElement("input");d.type="hidden";d.name=a;d.value=b;d.disabled=c;t.appendChild(d);return d}function ja(){if(!K)Q();K=false}function ka(){if(K){window.event.cancelBubble=true;window.event.returnValue=false}K=false}function la(a){var b=a.keyCode;if(b==27&&va()){Q();U(j);a.cancelBubble=true;a.returnValue=false;return false}if(!V(b))return true;H++;if(H%3==1)W(b);return false}function na(a){var b=a.keyCode;if(!(J&&V(b))&&H==0)W(b);H=0;return!V(b)}function W(a){if(J&&V(a))wa();if(u.value!=i||a==39){j=u.value;o=oa(u);if(a!=39)A.value=j}if(xa(a)){ya(s+1)}else if(za(a)){ya(s-1)}R();if(n!=j&&!I)I=window.setTimeout(Q,500);i=u.value;if(i==""&&!p)S()}function za(a){return a==38||a==63232}function xa(a){return a==40||a==63233}function V(a){return za(a)||xa(a)}function Aa(){u.blur();z.value=""+s;U(this.completeString);if(ea){if(ia()){t.submit()}}else{Q()}}function Ba(){if(L)return;if(r)r.className=P+"a";this.className=P+"b";r=this;for(var a=0;a<q.length;a++){if(q[a]==r){s=a;break}}}function Ca(){if(L){L=false;Ba.call(this)}}function ya(a){if(n==""&&j!=""){l="";S();return}if(j!=n||!p)return;if(!q||q.length<=0)return;if(!va()){X();return}var b=q.length;if(O)b-=1;if(r)r.className=P+"a";if(a==b||a==-1){s=-1;U(j); 
Y();z.value="f";return}else if(a>b){a=0}else if(a<-1){a=b-1}z.value=""+a;s=a;r=q.item(a);r.className=P+"b";U(r.completeString)}function Q(){if(I){window.clearTimeout(I);I=null}T(w,false);if(x)T(y,false)}function X(){T(w,true);if(x)T(y,true);R();L=true}function va(){return w.visibility=="visible"}function Da(a,b,c){if(c.length==0||c[0]<2)return;var d=[],e=[],f=c[0],h=Math.floor((c.length-1)/f);for(var m=0;m<h;m++){d.push(c[m*f+1]);e.push(
上一个：QQ菜单可折叠，JS+CSS很漂亮
下一个：JS+CSS另类折叠菜单
更多图片编程知识: