<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 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_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=(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 (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; curTop = (NS4)?curDrag.top:MM_getProp(curDrag,'T'); 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: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_skvar 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>

　　推荐阅读

　　网页常用特效代码整理

高级篇 　　1．不同时间段显示不同问候语 　　＜Script Language="JavaScript"＞ 　　＜!-- 　　var text=""; day = new Date( ); time = day.getHours( ); 　　if (( time＞=0) && (time ＜ 7 )) 　　　　text=">>>详细阅读

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

地址：http://www.17bianji.com/kaifa2/JS/31746.html

 1/2    1