怎样使得一个层可以呗随意拖动?

Question

<div id=MoveDiv style=position:absolute;left:200;top:50;width:100;height:300;background:blue>
<div style=position:absolute;left:0;top:0;width:100;height:20;background:red onmousedown=MDown(MoveDiv)>
按这里移动
</div>
</div><script>
var Obj=''
document.onmouseup=MUp
document.onmousemove=MMovefunction MDown(Object){
Obj=Object.id
document.all(Obj).setCapture()
pX=event.x-document.all(Obj).style.pixelLeft;
pY=event.y-document.all(Obj).style.pixelTop;
}function MMove(){
if(Obj!=''){
document.all(Obj).style.left=event.x-pX;
document.all(Obj).style.top=event.y-pY;
}
}function MUp(){
if(Obj!=''){
document.all(Obj).releaseCapture();
Obj='';
}
}
</script>

Answer 1

随意写的,希望对你的启发<script>
var ms=0;
function did(obj){
ms=obj;
event.srcElement.setCapture();
x=document.all(ms).style.pixelLeft-event.x;
y=document.all(ms).style.pixelTop-event.y;
}function document.onmousemove(){
if(ms){
document.all(ms).style.pixelLeft=x+event.x;
document.all(ms).style.pixelTop=y+event.y;
}
}function document.onmouseup(){
if(ms){
event.srcElement.releaseCapture();
ms=0;
}
}
</script>
<div id=a1 style=position:absolute>
<div id=a2 onmousedown=did('a1') style="background-color:#f2f2f2;cursor:move">拖动层</div>
</div>

Answer 2

http://expert.csdn.net/Expert/TopicView2.asp?id=1057545&datebasetype=now

Answer 3

<script language="javascript">
var IE5=(document.getElementById && document.all)? true : false;
var W3C=(document.getElementById)? true: false;
var currIDb=null, currIDs=null, xoff=0, yoff=0; zctr=0; totz=0;
function trackmouse(evt){
if((currIDb!=null) && (currIDs!=null)){
var x=(IE5)? event.clientX+document.body.scrollLeft : evt.pageX;
var y=(IE5)? event.clientY+document.body.scrollTop : evt.pageY;
currIDb.style.left=x+xoff+'px';
currIDs.style.left=x+xoff+10+'px';
currIDb.style.top=y+yoff+'px';
currIDs.style.top=y+yoff+10+'px';
return false;
}}function stopdrag(){
currIDb=null;
currIDs=null;
NS6bugfix();
}function grab_id(evt){
xoff=parseInt(this.IDb.style.left)-((IE5)? event.clientX+document.body.scrollLeft : evt.pageX);
yoff=parseInt(this.IDb.style.top)-((IE5)? event.clientY+document.body.scrollTop : evt.pageY);
currIDb=this.IDb;
currIDs=this.IDs;
}function NS6bugfix(){
if(!IE5){
self.resizeBy(0,1);
self.resizeBy(0,-1);
}}function incrzindex(){
zctr=zctr+2;
this.subb.style.zIndex=zctr;
this.subs.style.zIndex=zctr-1;
}function createPopup(id, title, width, height, x , y , isdraggable, boxcolor, barcolor, shadowcolor, text, textcolor, textptsize, textfamily ){
if(W3C){
zctr+=2;
totz=zctr;
var txt='';
txt+='<div id="'+id+'_s" style="position:absolute; left:'+(x+10)+'px; top:'+(y+10)+'px; width:'+width+'px; height:'+height+'px; background-color:'+shadowcolor+'; filter:alpha(opacity=50); visibility:visible"> </div>';
txt+='<div id="'+id+'_b" style="border:outset '+barcolor+' 2px; position:absolute; left:'+x+'px; top:'+y+'px; width:'+width+'px; overflow:hidden; height:'+height+'px; background-color:'+boxcolor+'; visibility:visible">';
txt+='<div style="width:'+width+'px; height:16px; background-color:'+barcolor+'; padding:0px; border:0px;"><table cellpadding="0" cellspacing="0" border="0" width="'+(IE5? width-4 : width)+'"><tr><td width="'+(width-20)+'"><div id="'+id+'_h" style="width:'+(width-20)+'px; height:14px; font: bold 12px sans-serif; color:'+textcolor+'"> '+title+'</div></td><td align="right"><a onmousedown="document.getElementById(\''+id+'_s\').style.display=\'none\'; document.getElementById(\''+id+'_b\').style.display=\'none\';return false"><img src="close.gif" border="0" height="11" width="11"></a></td></tr></table></div>';
txt+='<div id="'+id+'_ov" width:'+width+'px; style="margin:2px; color:'+textcolor+'; font:'+textptsize+'pt '+textfamily+';">'+text+'</div></div>';
document.write(txt);
this.IDh=document.getElementById(id+'_h');
this.IDh.IDb=document.getElementById(id+'_b');
this.IDh.IDs=document.getElementById(id+'_s');
this.IDh.IDb.subs=this.IDh.IDs;
this.IDh.IDb.subb=this.IDh.IDb;
this.IDh.IDb.IDov=document.getElementById(id+'_ov');
if(IE5){
this.IDh.IDb.IDov.style.width=width-6;
this.IDh.IDb.IDov.style.height=height-22;
this.IDh.IDb.IDov.style.scrollbarBaseColor=boxcolor;
this.IDh.IDb.IDov.style.overflow="auto";
}else{
this.IDh.IDs.style.MozOpacity=.5;
}
this.IDh.IDb.onmousedown=incrzindex;
if(isdraggable){
this.IDh.onmousedown=grab_id;
this.IDh.onmouseup=stopdrag;
}}}
if(W3C)document.onmousemove=trackmouse;
if(!IE5 && W3C)window.onload=NS6bugfix;
createPopup( 'box3', '.:CSDN:.' , 300, 150, 50, 155, true, 'de9ede' , '000000' , '840000' , '<table border=1><tr><td>dfsfds</td></tr></table> ', 'FFFFFF' , 9 , 'arial');
</script>

Answer 4

谢谢几位,我经过比较发现,其实几种方法耗的资源差不多,资源耗多少主要决定在layer中有多少东西.fason和lgchao的其实是一样的,我最后也用了这样的方法实现了.possible_Y(这个问题有点儿难度！) 的方法实在是高,功能做的比较全,只是用了createpopup()方法的原因而不能支持任何输入,包括textfield和textarea.而且这样的代码可维护性比较差,重用就更难...
非常谢谢几位,tahanks a lot

Answer 5

请问下，一个Panel层能否遮盖DropDownList控件？