可以移动的层

css 代码

1. "text/css">   
2.   
3. .divcc{   
4.     position:absolute;   
5.     border: 1px #FF99FF solid;   
6.     background-color:#FFFF99;    
7.     height:auto;    
8.     width:300px;    
9.     z-index:1000;   
10. }   
11.   
12. .divdd{   
13.     position:absolute;   
14.     border: 0px;   
15.     background-color:#FFFF80;    
16.     height:auto;    
17.     width:300px;    
18.     z-index:999;   
19. }   
20.   
21.   

 js 代码

1. <script language=< span="">"javascript">   
2.   
3.     function cursorover(){   
4.         document.getElementById("cc").style.cursor="move";   
5.     }   
6.   
7.     function cursorout(){   
8.         document.getElementById("cc").style.cursor="auto";   
9.     }   
10.   
11.     //可移动的层   
12.     var dragapproved=false;   
13.     var z,x,y;   
14.   
15.     function move(){   
16.         if (event.button==1&&dragapproved){   
17.             z.style.pixelLeft=temp1+event.clientX-x;   
18.             z.style.pixelTop=temp2+event.clientY-y;   
19.             return false;   
20.         }   
21.         if(event.button==2){   
22.             alert("别复制！！");   
23.             return false;   
24.         }   
25.     }   
26.   
27.     function drags(){   
28.         if (!document.all)   
29.             return;   
30.         if (event.srcElement.className=="divcc"){   
31.             dragapproved=true;   
32.             z=event.srcElement;   
33.             temp1=z.style.pixelLeft;   
34.             temp2=z.style.pixelTop;   
35.             x=event.clientX;   
36.             y=event.clientY;   
37.             document.οnmοusemοve=move;   
38.         }   
39.     }   
40.   
41.     document.οnmοusedοwn=drags;   
42.     document.οnmοuseup=new Function("dragapproved=false");   
43. //--------------------------------------------------------------------------------------------------------------------------   
44.   
45.     //初始化层位置   
46.     function init(){   
47.         var w =document.documentElement.clientWidth;   
48.         var h =document.documentElement.clientHeight;   
49.         var divObj = document.getElementById("cc");   
50.         divObj.style.left = w/2;   
51.         divObj.style.top = h/2;   
52.     }   
53.     //最大化   
54.     function max(){   
55.         document.getElementById("dd").style.display="inline";   
56.         var divObj = document.getElementById("cc");   
57.         divObj.style.width="300px";   
58.         var w =document.documentElement.clientWidth;   
59.         var h =document.documentElement.clientHeight;   
60.         divObj.style.left = w/2;   
61.         divObj.style.top = h/2;   
62.     }   
63.     //最小化   
64.     function min(){   
65.         document.getElementById("dd").style.display="none";   
66.         var divObj = document.getElementById("cc");   
67.         var w =document.documentElement.clientWidth;            //获得网页可见区域的宽度（不包括边框）   
68.         var h =document.documentElement.clientHeight;           //获得网页可见区域的高度（不包括边框）   
69.         divObj.style.width="150px";                             //设置层宽度   
70.         var myw = divObj.offsetWidth;                           //获得自身的宽度（包括边框）   
71.         var myh = divObj.offsetHeight;                          //获得自身的高度（包括边框）   
72.         var curw = w - myw;   
73.         var curh = h - myh;   
74.         divObj.style.left = curw;   
75.         divObj.style.top = curh;   
76.     }   
77.     //关闭   
78.     function clo(){   
79.         document.getElementById("cc").style.display="none";   
80.     }   
81. </script>