纯JS模仿Google个性化主页2

<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
< html >
< head >
< title > MyPixbot </ title >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=iso-8859-1" >
< script  language ="JavaScript"  type ="text/JavaScript" >
<!--
function  MM_reloadPage(init) {   // reloads the window if Nav4 resized
if  (init == true )  with  (navigator) { if  ((appName == " Netscape " ) && (parseInt(appVersion) == 4 )) {
document.MM_pgW = innerWidth; document.MM_pgH = innerHeight; onresize = MM_reloadPage; }}
else   if  (innerWidth != document.MM_pgW  ||  innerHeight != document.MM_pgH) location.reload();
}
MM_reloadPage( true );
function  MM_findObj(n, d) {  // v4.01
var  p,i,x;   if ( ! d) d = document;  if ((p = n.indexOf( " ? " )) > 0 && parent.frames.length) {
d = parent.frames[n.substring(p + 1 )].document; n = n.substring( 0 ,p);}
if ( ! (x = d[n]) && d.all) x = d.all[n];  for  (i = 0 ; ! x && i < d.forms.length;i ++ ) x = d.forms[i][n];
for (i = 0 ; ! x && d.layers && i < d.layers.length;i ++ ) x = MM_findObj(n,d.layers[i].document);
if ( ! x  &&  d.getElementById) x = d.getElementById(n);  return  x;
}
function  MM_showHideLayers() {  // v6.0
var  i,p,v,obj,args = MM_showHideLayers.arguments;
for  (i = 0 ; i < (args.length - 2 ); i += 3 )  if  ((obj = MM_findObj(args[i])) != null ) { v = args[i + 2 ];
if  (obj.style) { obj = obj.style; v = (v == 'show') ? 'visible':(v == 'hide') ? 'hidden':v; }
obj.visibility = v; }
}
function  MM_dragLayer(objName,x,hL,hT,hW,hH,toFront,dropBack,cU,cD,cL,cR,targL,targT,tol,dropJS,et,dragJS) {  // v4.01
// Copyright 1998 Macromedia, Inc. All rights reserved.
var  i,j,aLayer,retVal,curDrag = null ,curLeft,curTop,IE = document.all,NS4 = document.layers;
var  NS6 = ( ! IE && document.getElementById), NS = (NS4 || NS6);  if  ( ! IE  &&   ! NS)  return   false ;
retVal  =   true ;  if (IE  &&  event) event.returnValue  =   true ;
if  (MM_dragLayer.arguments.length  >   1 ) {
curDrag  =  MM_findObj(objName);  if  ( ! curDrag)  return   false ;
if  ( ! document.allLayers) { document.allLayers  =   new  Array();
with  (document)  if  (NS4) {  for  (i = 0 ; i < layers.length; i ++ ) allLayers[i] = layers[i];
for  (i = 0 ; i < allLayers.length; i ++ )  if  (allLayers[i].document  &&  allLayers[i].document.layers)
with  (allLayers[i].document)  for  (j = 0 ; j < layers.length; j ++ ) allLayers[allLayers.length] = layers[j];
}  else  {
if  (NS6) {  var  spns  =  getElementsByTagName( " span " );  var  all  =  getElementsByTagName( " div " );
for  (i = 0 ;i < spns.length;i ++ )  if  (spns[i].style && spns[i].style.position) allLayers[allLayers.length] = spns[i];}
for  (i = 0 ;i < all.length;i ++ )  if  (all[i].style && all[i].style.position) allLayers[allLayers.length] = all[i];
} }
curDrag.MM_dragOk = true ; curDrag.MM_targL = targL; curDrag.MM_targT = targT;
curDrag.MM_tol = Math.pow(tol, 2 ); curDrag.MM_hLeft = hL; curDrag.MM_hTop = hT;
curDrag.MM_hWidth = hW; curDrag.MM_hHeight = hH; curDrag.MM_toFront = toFront;
curDrag.MM_dropBack = dropBack; curDrag.MM_dropJS = dropJS;
curDrag.MM_everyTime = et; curDrag.MM_dragJS = dragJS;
curDrag.MM_oldZ  =  (NS4) ? curDrag.zIndex:curDrag.style.zIndex;
curLeft =  (NS4) ? curDrag.left:(NS6) ? parseInt(curDrag.style.left):curDrag.style.pixelLeft;
if  (String(curLeft) == " NaN " ) curLeft = 0 ; curDrag.MM_startL  =  curLeft;
curTop  =  (NS4) ? curDrag.top:(NS6) ? parseInt(curDrag.style.top):curDrag.style.pixelTop;
if  (String(curTop) == " NaN " ) curTop = 0 ; curDrag.MM_startT  =  curTop;
curDrag.MM_bL = (cL < 0 ) ? null :curLeft - cL; curDrag.MM_bT = (cU < 0 ) ? null :curTop - cU;
curDrag.MM_bR = (cR < 0 ) ? null :curLeft + cR; curDrag.MM_bB = (cD < 0 ) ? null :curTop + cD;
curDrag.MM_LEFTRIGHT = 0 ; curDrag.MM_UPDOWN = 0 ; curDrag.MM_SNAPPED = false ;  // use in your JS!
document.onmousedown  =  MM_dragLayer; document.onmouseup  =  MM_dragLayer;
if  (NS) document.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP);
}  else  {
var  theEvent  =  ((NS) ? objName.type:event.type);
if  (theEvent  ==  'mousedown') {
var  mouseX  =  (NS) ? objName.pageX : event.clientX  +  document.body.scrollLeft;
var  mouseY  =  (NS) ? objName.pageY : event.clientY  +  document.body.scrollTop;
var  maxDragZ = null ; document.MM_maxZ  =   0 ;
for  (i = 0 ; i < document.allLayers.length; i ++ ) { aLayer  =  document.allLayers[i];
var  aLayerZ  =  (NS4) ? aLayer.zIndex:parseInt(aLayer.style.zIndex);
if  (aLayerZ  >  document.MM_maxZ) document.MM_maxZ  =  aLayerZ;
var  isVisible  =  (((NS4) ? aLayer.visibility:aLayer.style.visibility).indexOf('hid')  ==   - 1 );
if  (aLayer.MM_dragOk  !=   null   &&  isVisible)  with  (aLayer) {
var  parentL = 0 ;  var  parentT = 0 ;
if  (NS6) { parentLayer  =  aLayer.parentNode;
while  (parentLayer  !=   null   &&  parentLayer.style.position) {
parentL  +=  parseInt(parentLayer.offsetLeft); parentT  +=  parseInt(parentLayer.offsetTop);
parentLayer  =  parentLayer.parentNode;
} }  else   if  (IE) { parentLayer  =  aLayer.parentElement;
while  (parentLayer  !=   null   &&  parentLayer.style.position) {
parentL  +=  parentLayer.offsetLeft; parentT  +=  parentLayer.offsetTop;
parentLayer  =  parentLayer.parentElement; } }
var  tmpX = mouseX - (((NS4) ? pageX:((NS6) ? parseInt(style.left):style.pixelLeft) + parentL) + MM_hLeft);
var  tmpY = mouseY - (((NS4) ? pageY:((NS6) ? parseInt(style.top):style.pixelTop)  + parentT) + MM_hTop);
if  (String(tmpX) == " NaN " ) tmpX = 0 ;  if  (String(tmpY) == " NaN " ) tmpY = 0 ;
var  tmpW  =  MM_hWidth;   if  (tmpW  <=   0 ) tmpW  +=  ((NS4) ? clip.width :offsetWidth);
var  tmpH  =  MM_hHeight;  if  (tmpH  <=   0 ) tmpH  +=  ((NS4) ? clip.height:offsetHeight);
if  (( 0   <=  tmpX  &&  tmpX  <  tmpW  &&   0   <=  tmpY  &&  tmpY  <  tmpH)  &&  (maxDragZ  ==   null
||  maxDragZ  <=  aLayerZ)) { curDrag  =  aLayer; maxDragZ  =  aLayerZ; } } }
if  (curDrag) {
document.onmousemove  =  MM_dragLayer;  if  (NS4) document.captureEvents(Event.MOUSEMOVE);
curLeft  =  (NS4) ? curDrag.left:(NS6) ? parseInt(curDrag.style.left):curDrag.style.pixelLeft;
curTop  =  (NS4) ? curDrag.top:(NS6) ? parseInt(curDrag.style.top):curDrag.style.pixelTop;
if  (String(curLeft) == " NaN " ) curLeft = 0 ;  if  (String(curTop) == " NaN " ) curTop = 0 ;
MM_oldX  =  mouseX  -  curLeft; MM_oldY  =  mouseY  -  curTop;
document.MM_curDrag  =  curDrag;  curDrag.MM_SNAPPED = false ;
if (curDrag.MM_toFront) {
eval('curDrag.' + ((NS4) ? '':'style.') + 'zIndex = document.MM_maxZ + 1 ');
if  ( ! curDrag.MM_dropBack) document.MM_maxZ ++ ; }
retVal  =   false ;  if ( ! NS4 &&! NS6) event.returnValue  =   false ;
} }  else   if  (theEvent  ==  'mousemove') {
if  (document.MM_curDrag)  with  (document.MM_curDrag) {
var  mouseX  =  (NS) ? objName.pageX : event.clientX  +  document.body.scrollLeft;
var  mouseY  =  (NS) ? objName.pageY : event.clientY  +  document.body.scrollTop;
newLeft  =  mouseX - MM_oldX; newTop   =  mouseY - MM_oldY;
if  (MM_bL != null ) newLeft  =  Math.max(newLeft,MM_bL);
if  (MM_bR != null ) newLeft  =  Math.min(newLeft,MM_bR);
if  (MM_bT != null ) newTop   =  Math.max(newTop ,MM_bT);
if  (MM_bB != null ) newTop   =  Math.min(newTop ,MM_bB);
MM_LEFTRIGHT  =  newLeft - MM_startL; MM_UPDOWN  =  newTop - MM_startT;
if  (NS4) {left  =  newLeft; top  =  newTop;}
else   if  (NS6){style.left  =  newLeft; style.top  =  newTop;}
else  {style.pixelLeft  =  newLeft; style.pixelTop  =  newTop;}
if  (MM_dragJS) eval(MM_dragJS);
retVal  =   false ;  if ( ! NS) event.returnValue  =   false ;
} }  else   if  (theEvent  ==  'mouseup') {
document.onmousemove  =   null ;
if  (NS) document.releaseEvents(Event.MOUSEMOVE);
if  (NS) document.captureEvents(Event.MOUSEDOWN);  // for mac NS
if  (document.MM_curDrag)  with  (document.MM_curDrag) {
if  ( typeof  MM_targL  == 'number'  &&   typeof  MM_targT  ==  'number'  &&
(Math.pow(MM_targL - ((NS4) ? left:(NS6) ? parseInt(style.left):style.pixelLeft), 2 ) +
Math.pow(MM_targT - ((NS4) ? top:(NS6) ? parseInt(style.top):style.pixelTop), 2 )) <= MM_tol) {
if  (NS4) {left  =  MM_targL; top  =  MM_targT;}
else   if  (NS6) {style.left  =  MM_targL; style.top  =  MM_targT;}
else  {style.pixelLeft  =  MM_targL; style.pixelTop  =  MM_targT;}
MM_SNAPPED  =   true ; MM_LEFTRIGHT  =  MM_startL - MM_targL; MM_UPDOWN  =  MM_startT - MM_targT; }
if  (MM_everyTime  ||  MM_SNAPPED) eval(MM_dropJS);
if (MM_dropBack) { if  (NS4) zIndex  =  MM_oldZ;  else  style.zIndex  =  MM_oldZ;}
retVal  =   false ;  if ( ! NS) event.returnValue  =   false ; }
document.MM_curDrag  =   null ;
}
if  (NS) document.routeEvent(objName);
}  return  retVal;
}
function  loadwin(obj){
with (MM_findObj(obj)) with (style){
filters[ 0 ].apply();
display = '';
filters[ 0 ].play();
}
}
function  cs(captionBG,bodyBG,tableBG){
oldBody = document.body;
with (oldBody){
var  newBody = cloneNode();
style.filter = 'blendtrans(duration = 1 )';
filters[ 0 ].apply();
with (document.styleSheets[ 0 ]){
with (rules[ 0 ].style){backgroundColor = captionBG;}
with (rules[ 1 ].style){backgroundColor = bodyBG;}
with (rules[ 2 ].style){backgroundColor = tableBG}
}
filters[ 0 ].play();
setTimeout( function (){
if (oldBody != null ){
oldBody.applyElement(newBody,  " inside " )
oldBody.swapNode(newBody);
oldBody.removeNode( true );
}
}, 1500 );
}
}
// -->
</ script >
< style  type ="text/css" >
<!--
.caption  {
font-size :  9px ;
color :  #FFFFFF ;
background-color :  #00CCFF ;
padding-left :  5px ;
cursor :  default ;
font-family :  "Verdana", "Arial" ;
border :  1px inset ;
}
body  {
background-color :  #f6f6f6 ;
border :  1px inset ;
overflow :  hidden ;
}
table  {
background-color :  #eeeeee ;
}
td  {
font-family :  "Verdana", "Arial" ;
font-size :  9px ;
border :  0px ;
}
.win  {
filter : BlendTrans(duration=1) DropShadow(Color=#cccccc, OffX=3, OffY=3) alpha(opacity=90)
}
a  {
text-decoration :  none ;
color :  #003399 ;
}
a:hover  {
color :  #FF0000 ;
}
input  {
font-family :  "Verdana", "Arial" ;
font-size :  9px ;
border-width :  1px ;
}
.statusbar  {
font-family :  "Tahoma", "Verdana" ;
font-size :  9px ;
color :  #999999 ;
padding-left :  3px ;
}
.button  {
border :  1px outset ;
text-align :  center ;
}
.navframe  {
padding :  5px ;
}
-->
</ style >
</ head >
< body >
< div  id ="assist"  style ="position:absolute; left:15px; top:68px; width:185px; z-index:1;display:none;"  class ="win"  onMouseDown ="MM_dragLayer('assist','',0,0,150,18,true,false,-1,-1,-1,-1,15,68,100,'',false,'')" >
< table  width ="180"  border ="1"  cellpadding ="0"  cellspacing ="0" >
< tr >
< td  class ="caption" > SeekAssist </ td >
< td  width ="14"  align ="center" >< a  href ="#"  onclick ="with(MM_findObj('assistwin').style)display=display=='none'?'':'none'" > % </ a ></ td >
< td  width ="14"  align ="center" >< a  href ="#"  onClick ="MM_showHideLayers('assist','','hide')" > X </ a ></ td >
</ tr >
< tr  id ="assistwin" >
< td  height ="100"  colspan ="3"  bordercolor ="#eeeeee" > &nbsp; </ td >
</ tr >
</ table >
< br >
</ div >
< script > loadwin('assist') </ script >
< div  id ="rank"  style ="position:absolute; left:15px; top:194px; width:185px; z-index:1;display:none;"  class ="win"  onMouseDown ="MM_dragLayer('rank','',0,0,150,18,true,false,-1,-1,-1,-1,15,194,100,'',false,'')" >
< table  width ="180"  border ="1"  cellpadding ="0"  cellspacing ="0" >
< tr >
< td  class ="caption" > SeekRank </ td >
< td  width ="14"  align ="center" >< a  href ="#"  onclick ="with(MM_findObj('rankwin').style)display=display=='none'?'':'none'" > % </ a ></ td >
< td  width ="14"  align ="center" >< a  href ="#"  onClick ="MM_showHideLayers('assist','','inherit','rank','','hide')" > X </ a ></ td >
</ tr >
< tr  id ="rankwin" >
< td  height ="100"  colspan ="3"  bordercolor ="#eeeeee" > &nbsp; </ td >
</ tr >
</ table >
< br >
</ div >
< script > setTimeout( " loadwin('rank') " , 500 ) </ script >
< div  id ="mycolor"  style ="position:absolute; left:15px; top:320px; width:185px; z-index:1;display:none;"  class ="win"  onMouseDown ="MM_dragLayer('mycolor','',0,0,150,18,true,false,-1,-1,-1,-1,15,320,100,'',false,'')" >
< table  width ="180"  border ="1"  cellpadding ="0"  cellspacing ="0" >
< tr >
< td  class ="caption" > MyColor </ td >
< td  width ="14"  align ="center" >< a  href ="#"  onclick ="with(MM_findObj('mycolorwin').style)display=display=='none'?'':'none'" > % </ a ></ td >
< td  width ="14"  align ="center" >< a  href ="#"  onClick ="MM_showHideLayers('mycolor','','hide')" > X </ a ></ td >
</ tr >
< tr  id ="mycolorwin" >
< td  height ="100"  colspan ="3"  bordercolor ="#eeeeee" >< table  width ="100%"  border ="0"  cellspacing ="0"  cellpadding ="2" >
< tr >
< td  align ="center" >< a  href ="#"  onclick ="cs('#00CCFF','#f6f6f6','#eeeeee')" > Default </ a ></ td >
</ tr >
< tr >
< td  align ="center" >< a  href ="#"  onclick ="cs('red','#eeccee','#eeddee')" > StyleSheet#1 </ a ></ td >
</ tr >
< tr >
< td  align ="center" >< a  href ="#"  onclick ="cs('#99ccff','#eeeeee','#ccddff')" > StyleSheet#2 </ a ></ td >
</ tr >
< tr >
< td  align ="center" >< a  href ="#"  onclick ="cs('#ff9999','#ffffff','#ffeeff')" > StyleSheet#3 </ a ></ td >
</ tr >
< tr >
< td  align ="center" >< a  href ="#"  onclick ="cs('skyblue','#eeeeee','#99ddff')" > StyleSheet#4 </ a ></ td >
</ tr >
< tr >
< td  align ="center" >< a  href ="#"  onclick ="cs('#009900','#eeffee','#ddffdd')" > StyleSheet#5 </ a ></ td >
</ tr >
</ table ></ td >
</ tr >
</ table >
< br >
</ div >
< script > setTimeout( " loadwin('mycolor') " , 1000 ) </ script >
< div  id ="results"  style ="position:absolute; left:204px; top:68px; width:575px; z-index:1;display:none;"  class ="win"  onMouseDown ="MM_dragLayer('results','',0,0,400,18,true,false,-1,-1,-1,-1,204,68,50,'',false,'')" >
< table  width ="570"  border ="1"  cellpadding ="0"  cellspacing ="0" >
< tr >
< td >< table  width ="100%"  border ="0"  cellspacing ="0"  cellpadding ="0" >
< tr >
< td  class ="caption" > Results </ td >
< td  width ="12"  class ="button" >< a  href ="#"  onClick ="with(MM_findObj('resultswin').style)display=display=='none'?'':'none'" > % </ a ></ td >
< td  width ="12"  class ="button" >< a  href ="#"  onClick ="MM_showHideLayers('results','','inherit')" > X </ a ></ td >
</ tr >
</ table ></ td >
</ tr >
< tr >
< td  height ="20"  bordercolor ="#eeeeee" >< input  name ="url"  type ="text"  value ="http://www.google.com/search?q=ezlee"  size ="100" >
< a  href ="#"  onclick ="mainframe.location=url.value" > Search </ a ></ td >
</ tr >
< tr  id ="resultswin" >
< td  height ="318"  valign ="top"  class ="navframe" >< aiframe  name ="mainframe"  id ="mainframe"  src ="http://www.google.com/search?q=ezlee"  width ="100%"  height ="100%"  frameborder ="0"  scrolling ="auto" >< font  color ="#FF0000" > Welcome! </ font ></ aiframe ></ td >
</ tr >
< tr >
< td  height ="14"  class ="statusbar" > Ready! </ td >
</ tr >
</ table >
< br >
</ div >
< script > setTimeout( " loadwin('results') " , 2000 ) </ script >
</ body >
</ html >