可拖动窗口，附带鼠标控制渐变透明，开启关闭功能

　　<style type=text/css>
<!--
#Layer1 {
position:absolute;
width:210px;
height:160px;
z-index:1;
left: 178px;
top: 322px;
background-color: #FFFBF0;
}
#content {
position:absolute;
width:200px;
height:115px;
z-index:1;
left: 0px;
top: 27px;
border: 1px solid #666666;
}
#bar {
position:absolute;
width:200px;
height:25px;
z-index:2;
background-color: #00FF33;
left: 0px;
top: 0px;
}
#but_1 {
position:absolute;
width:14px;
height:14px;
z-index:3;
left: 183px;
top: 6px;
overflow: hidden;
background-color: #333333;
}
#but_2 {
position:absolute;
width:10px;
height:10px;
z-index:4;
left: 164px;
top: 6px;
background-color: #00FF33;
border: 2px solid #666666;
overflow: hidden;
}
-->
</style>
<script type=text/JavaScript>
<!--
function MM_findObj(n, d) { //v4.01
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];
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

　　function MM_scanStyles(obj, prop) { //v8.0
var inlineStyle = null; var ccProp = prop; var dash = ccProp.indexOf(-);
while (dash != -1){ccProp = ccProp.substring(0, dash) + ccProp.substring(dash+1,dash+2).toUpperCase() + ccProp.substring(dash+2); dash = ccProp.indexOf(-);}
inlineStyle = eval(obj.style. + ccProp);
if(inlineStyle) return inlineStyle;
var ss = document.styleSheets;
for (var x = 0; x < ss.length; x++) { var rules = ss[x].cssRules;
for (var y = 0; y < rules.length; y++) { var z = rules[y].style;
if(z[prop] && (rules[y].selectorText == *[ID + obj.id + ])) {
return z[prop];
} } } return ;
}

　　function MM_getProp(obj, prop) { //v8.0
if (!obj) return ();
if (prop == L) return obj.offsetLeft;
else if (prop == T) return obj.offsetTop;
else if (prop == W) return obj.offsetWidth;
else if (prop == H) return obj.offsetHeight;
else {
if (typeof(window.getComputedStyle) == undefined) {
if (typeof(obj.currentStyle) == undefined){
if (prop == P) return MM_scanStyles(obj,position);
else if (prop == Z) return MM_scanStyles(obj,z-index);
else if (prop == V) return MM_scanStyles(obj,visibility);
} else {
if (prop == P) return obj.currentStyle.position;
else if (prop == Z) return obj.currentStyle.zIndex;
else if (prop == V) return obj.currentStyle.visibility;
}
} else {
if (prop == P) return window.getComputedStyle(obj,null).getPropertyValue(position);
else if (prop == Z) return window.getComputedStyle(obj,null).getPropertyValue(z-index);
else if (prop == V) return window.getComputedStyle(obj,null).getPropertyValue(visibility);
}
}
}

　　function MM_dragLayer(objName,x,hL,hT,hW,hH,toFront,dropBack,cU,cD,cL,cR,targL,targT,tol,dropJS,et,dragJS) { //v8.0
//Copyright 2005 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=(NS4NS6); 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 (MM_getProp(spns[i],P)) allLayers[allLayers.length]=spns[i];}
for (i=0;i<all.length;i++) {
if (NS4){if (all[i].style&&all[i].style.position) allLayers[allLayers.length]=all[i];}
else if (MM_getProp(all[i],P)) 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:MM_getProp(curDrag,Z);
curLeft= (NS4)?curDrag.left:MM_getProp(curDrag,L);
if (String(curLeft)==NaN) curLeft=0; curDrag.MM_startL = curLeft;
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.MOUSEDOWNEvent.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:MM_getProp(aLayer,Z);
if (aLayerZ > document.MM_maxZ) document.MM_maxZ = aLayerZ;
var isVisible = ((NS4)?aLayer.visibility:MM_getProp(aLayer,V)).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 != document && MM_getProp(parentLayer,P)) {
parentL += parseInt(MM_getProp(parentLayer,L)); parentT += parseInt(MM_getProp(parentLayer,T));
parentLayer = parentLayer.parentNode;
if (parentLayer==document) parentLayer = null;
} } else if (IE) { parentLayer = aLayer.parentElement;
while (parentLayer != null && MM_getProp(parentLayer,P)) {
parentL += MM_getProp(parentLayer,L); parentT += MM_getProp(parentLayer,T);
parentLayer = parentLayer.parentElement; } }
var tmpX=mouseX-((NS4)?pageX:(MM_getProp(aLayer,L))+parentL+MM_hLeft);
var tmpY=mouseY-((NS4)?pageY:(MM_getProp(aLayer,T))+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:MM_getProp(aLayer,W);
var tmpH = MM_hHeight; if (tmpH <= 0) tmpH += (NS4)?clip.height:MM_getProp(aLayer,H);
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:MM_getProp(curDrag,L);
curTop = (NS4)?curDrag.top:MM_getProp(curDrag,T);
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) {
var newZ = parseInt(document.MM_maxZ)+1;
eval(curDrag.+((NS4)?:style.)+zIndex=newZ);
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;
var newLeft = mouseX-MM_oldX; var 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 + px; style.top = newTop + px;}
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:MM_getProp(document.MM_curDrag,L)),2)+
Math.pow(MM_targT-((NS4)?top:MM_getProp(document.MM_curDrag,T)),2))<=MM_tol) {
if (NS4) {left = MM_targL; top = MM_targT;}
else if (NS6) {style.left = MM_targL + px; style.top = MM_targT + px;}
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;
}
//-->
</script>

　　<script>
<!--
// code by windy_sk
var timer=null;
var org_opacity=30;
var step=5;
var ext_time=30;

　　function doit(img,mode){
clearTimeout(timer);
if(img.style.filter.indexOf(alpha)==-1)img.style.filter+=alpha(opacity=+org_opacity+);
var cur_level=img.filters.alpha.opacity;
if(mode){
cur_level+=step;
if(cur_level>100)cur_level=100;
}else{
cur_level-=step;
if(cur_level<org_opacity)cur_level=org_opacity;
}
img.filters.alpha.opacity=cur_level;
if(cur_level!=100 && cur_level!==ext_time)
timer=setTimeout(doit(+img.id+,+mode+),ext_time)
}

　　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; }
}
//-->
</script>
</head>

　　<body onload=MM_dragLayer(Layer1,,0,0,0,0,true,false,-1,-1,-1,-1,false,false,0,,false,)>

　　<body bgcolor=#FFFBF0>

　　
<div id=Layer1 style=filter: alpha(opacity=30) onmouseover=doit(this,true) onmouseout=doit(this,false) >
<div id=content><img src=/img/common/logo.gif name=test width=90 height=27 border=0 id=test /></div>
<div id=bar></div>
<div id=but_1 onclick=MM_showHideLayers(content,,show)></div>
<div id=but_2 onclick=MM_showHideLayers(content,,hide)></div>
</div>