帶陰影的可拖動的浮動層

<!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==truewith (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;!&& i<d.forms.length;i++) x=d.forms[i][n]; 
  
for(i=0;!&& 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+=3if ((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 
= trueif(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=0var 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=0if (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=0if (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 
= falseif(!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 
= falseif(!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 
= falseif(!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) 
} 
{ 
    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"><href="#" onclick="with(MM_findObj('assistwin').style)display=display=='none'?'':'none'">%</a></td> 
                        
<td width="14" align="center"><href="#" onClick="MM_showHideLayers('assist','','hide')">X</a></td> 
                
</tr> 
                
<tr id="assistwin"> 
                        
<td height="100" colspan="3" bordercolor="#eeeeee"> </td> 
                
</tr> 
  
</table> 
        
 
</div> 
 
<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"><href="#" onclick="with(MM_findObj('rankwin').style)display=display=='none'?'':'none'">%</a></td> 
                        
<td width="14" align="center"><href="#" onClick="MM_showHideLayers('assist','','inherit','rank','','hide')">X</a></td> 
                
</tr> 
                
<tr id="rankwin"> 
                        
<td height="100" colspan="3" bordercolor="#eeeeee"> </td> 
                
</tr> 
  
</table> 
        
 
</div> 
 
<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"><href="#" onclick="with(MM_findObj('mycolorwin').style)display=display=='none'?'':'none'">%</a></td> 
                        
<td width="14" align="center"><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"><href="#" onclick="cs('#00CCFF','#f6f6f6','#eeeeee')">Default</a></td> 
                                
</tr> 
                                
<tr> 
                                        
<td align="center"><href="#" onclick="cs('red','#eeccee','#eeddee')">StyleSheet#1</a></td> 
                                
</tr> 
                                
<tr> 
                                        
<td align="center"><href="#" onclick="cs('#99ccff','#eeeeee','#ccddff')">StyleSheet#2</a></td> 
                                
</tr> 
                                
<tr> 
                                        
<td align="center"><href="#" onclick="cs('#ff9999','#ffffff','#ffeeff')">StyleSheet#3</a></td> 
                                
</tr> 
                                
<tr> 
                                        
<td align="center"><href="#" onclick="cs('skyblue','#eeeeee','#99ddff')">StyleSheet#4</a></td> 
                                
</tr> 
                                
<tr> 
                                        
<td align="center"><href="#" onclick="cs('#009900','#eeffee','#ddffdd')">StyleSheet#5</a></td> 
                                
</tr> 
                        
</table></td> 
                
</tr> 
  
</table> 
        
 
</div> 
 
<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"><href="#" onClick="with(MM_findObj('resultswin').style)display=display=='none'?'':'none'">%</a></td> 
                                                
<td width="12" class="button"><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"> 
                        
<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!</aiframe></td> 
                
</tr> 
                
<tr> 
                        
<td height="14" class="statusbar">Ready!</td> 
                
</tr> 
  
</table> 
        
 
</div> 
 
</body> 
</html> 
 
發佈了178 篇原創文章 · 獲贊 5 · 訪問量 28萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章