js
var posX;
var posY;
fdiv = documentgetElementById("divBody");
documentgetElementById("divHead")onmousedown=function(e)
{
if(!e) e = windowevent; //IE
posX = eclientX parseInt(fdivstyleleft);
posY = eclientY parseInt(fdivstyletop);
documentonmousemove = mousemove;
}
documentonmouseup = function()
{
documentonmousemove = null;
}
function mousemove(ev)
{
if(ev==null) ev = windowevent;//IE
fdivstyleleft = (evclientX posX) + "px";
fdivstyletop = (evclientY posY) + "px";
}
html
<div class="divBody" id="divBody" style="left: px; top: px;"> <!这里要加style="left: px; top: px;" 否则有问题>
<div class="divHead" id="divHead" style="cursor: move;">
</div>
<div class="content">
</div>
<div class="tail">
</div>
</div>
css:
divBody{
//margintop:px;
border: solid #CCC px;
width:px;
height:px;
position:relative;
zindex:;
marginleft:auto;
marginright:auto;
}
divHead{
width:px;
height:px;
backgroundcolor:#CCC;
}
content
{
width:px;
height:px;
}
tail{
background:#CCC;
height:px;
width:px;
display:tablecell;
verticalalign:middle;
}