很好玩的JS

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"> <HTML><HEAD><TITLE>5</TITLE> <META http-equiv=Content-Type content="text/html; charset=big5"> <META http-equiv=imagetoolbar content=no> <STYLE type=text/css>HTML {  OVERFLOW: hidden } BODY {  PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: #000; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 100%; CURSOR: crosshair; PADDING-TOP: 0px; POSITION: absolute; HEIGHT: 100% } #box {  BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; BACKGROUND: #111; VISIBILITY: hidden; BORDER-LEFT: gray 1px solid; BORDER-BOTTOM: gray 1px solid; POSITION: absolute } #screen {  BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; BACKGROUND: #000; LEFT: 0px; BORDER-LEFT: gray 1px solid; WIDTH: 100%; BORDER-BOTTOM: gray 1px solid; POSITION: absolute; TOP: 10%; HEIGHT: 80% } #box IMG {  BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; BORDER-LEFT: gray 1px solid; CURSOR: pointer; BORDER-BOTTOM: gray 1px solid; POSITION: absolute } #box SPAN {  FONT-SIZE: 12px; WIDTH: 200px; COLOR: #ccc; FONT-FAMILY: verdana; POSITION: absolute } #box A {  COLOR: #ff8000; TEXT-DECORATION: none } #box A:hover {  BACKGROUND: #ff8000; COLOR: #ffffff; TEXT-DECORATION: none } #box A:visited {  COLOR: #ff8000; TEXT-DECORATION: none } #box A:hover {  BACKGROUND: #ff8000; COLOR: #ffffff; TEXT-DECORATION: none } #lnk {  VISIBILITY: hidden } </STYLE>

<SCRIPT type=text/javascript language="javascript">

document.onselectstart = new Function("return false"); O    = new Array(); box  = 0; img  = 0; txt  = 0; tit  = 0; W    = 0; H    = 0; nI   = 0; sel  = 0; si   = 0; ZOOM = 0; rImg = 0; ////////////////// speed = .06; // animation speed delay = .5; // 1 = no delay //////////////////

function dText(){  txt.style.textAlign = tit.style.textAlign = (sel<nI/2)?"left":"right";  txt.innerHTML = O[sel].tx;  tit.innerHTML = O[sel].ti; }

function CObj(n, s, x, tx, ti){  this.n    = n;  this.dim  = s;  this.tx   = tx;  this.ti   = ti;  this.is   = img[n];  this.vz   = 0;  this.sx   = 0;  this.x0   = x;  this.x1   = 0;  this.zo   = 0;  this.over = function() {   with(this){    if(n!=sel){     O[sel].dim = 100;     O[n].dim = ZOOM * 100;     sel = n;     l = 0;     for(k=0; k<nI; k++){      O[k].x0 = l;      l += O[k].dim;     }     txt.innerHTML = tit.innerHTML = "";     setTimeout("dText()", 32);    }   }  }  this.anim = function () {   with(this){    vz  = speed*(vz+(x1-sx)*delay);    x1 -= vz;    sx  = (n==0)?0:O[n-1].x0+O[n-1].dim;    zo -= (zo-dim)*speed;    l   = (x1*si)+6*(n+1);    w   = zo*si;    is.style.left   = Math.round(l)+'px';    is.style.top    = Math.round((H-w*rImg)*.5)+'px';    is.style.width  = Math.round(w)+'px';    is.style.height = Math.round(w*rImg)+'px';    if(sel == n){     if(sel<nI*.5) {      tit.style.left = txt.style.left = Math.round(l+w+6)+'px';     } else {      tit.style.left = txt.style.left = Math.round(l-(nx*.25)-6)+'px';     }     txt.style.top = Math.round(-(w*rImg)*.25)+'px';     tit.style.top = Math.round((w*rImg)*.33)+'px';    }   }  } }

function run(){  for(j in O)O[j].anim();  setTimeout("run()", 16); }

function doResize(){  tit.style.width = Math.round(nx*.25)+'px';  txt.style.width = Math.round(nx*.25)+'px';  tit.style.fontSize = (nx/30)+'px';  txt.style.fontSize = (nx/70)+'px';  with(box.style){   width  = Math.round(W)+'px';   height = Math.round(H)+'px';   left   = Math.round(nx/2-W/2)+'px';   top    = Math.round(ny/2-H/2)+'px';  } }

function resize(){  nx = scr.offsetWidth;  ny = scr.offsetHeight;  W  =  nx*90/100;  si = (W-((nI+1)*6))/((ZOOM*100)+((nI-1)*100));  H  = (100*si*rImg)+14;  doResize(); } onresize = resize;

onload = function(){  scr = document.getElementById("screen");  box = document.getElementById("box");  tit = document.getElementById("tit");  txt = document.getElementById("txt");  img = box.getElementsByTagName("img");

 Lnk = document.getElementById("lnk").getElementsByTagName("a");  nI  = img.length;  ZOOM = nI;  rImg = img[0].height/img[0].width;  resize();  s = ZOOM * 100;  x = 0;  tit.innerHTML = img[0].title;  txt.innerHTML = img[0].alt;  for(i=0; i<nI; i++) {   var t = img[i].alt;   if(Lnk[i].href!="") t+='<br><a href="'+Lnk[i].href+'">'+Lnk[i].innerHTML+'</a>';   O[i] = new CObj(i, s, x, t, img[i].title);   img[i].alt = "";   img[i].title = "";   img[i].onmousedown = new Function("return false;");   img[i].onmouseover = new Function('O['+i+'].over();');   if(Lnk[i].href!=""){    /* ==== hyperlink ==== */    img[i].onclick = new Function('window.open("'+Lnk[i].href+'","_blank");');   }   x += s;   s = 100;  }  box.style.visibility = "visible";  run(); } </SCRIPT>

<META content="MSHTML 6.00.2900.3268" name=GENERATOR></HEAD> <BODY> <DIV id=screen> <DIV id=box ?><IMG title="Unimicron (SuZhou)" alt="" src="images/bgloading.gif"> <IMG title=test1 alt="" src="images/gou.gif"> <IMG title=test2 alt="" src="images/Winter.jpg"> <IMG title=test3 alt="" src="images/left.png"> <IMG title=test4 alt="" src="images/newmap02.png"> <IMG title=test5 alt="" src="images/srcexit.jpg"> <IMG title="test6" alt="" src="images/newmap482d.gif"> <SPAN id=txt></SPAN><SPAN id=tit></SPAN><SPAN id=lnk><A href="http://www.suz.unimicron.com/">http://www.suz.unimicron.com/</A> <A></A><A></A><A></A><A></A><A></A><A></A></SPAN></DIV></DIV><!-- crossbrowser images_loading_bar - Gerard Ferrandez - www.dhteumeuleu.com - Feb 2005 --><SPAN id=LB0 style="LEFT: 50%; POSITION: absolute; TOP: 50%"><SPAN style="FONT-SIZE: 10px; LEFT: -50px; COLOR: #ffffff; FONT-FAMILY: arial; POSITION: absolute; TOP: -18px">Loading...</SPAN> <SPAN style="FONT-SIZE: 1px; BACKGROUND: #333; LEFT: -50px; WIDTH: 100px; POSITION: absolute; TOP: -5px; HEIGHT: 10px"><SPAN id=LB1 style="FONT-SIZE: 1px; BACKGROUND: #ffffff; LEFT: 0px; WIDTH: 0px; POSITION: absolute; TOP: 0px; HEIGHT: 10px"></SPAN></SPAN></SPAN> <SCRIPT>m00=document.getElementById("box").getElementsByTagName("img");m01=m00.length;function images_loading_bar(){m02=0;for(i=0;i<m01;i++)m02+=(m00[i].complete)?1:0;document.getElementById("LB1").style.width=Math.round(m02/m01*100)+'px';if(m02==m01)setTimeout("document.getElementById('LB0').style.display='none'",128); else setTimeout("images_loading_bar()", 64);};images_loading_bar();</SCRIPT> <!-- end of images_loading_bar code --></BODY></HTML>