sinat_27891475 2015-09-27 08:29 采纳率: 50%
浏览 1489

仿windows窗口 4个角都能拖拽怎么实现

<!DOCTYPE HTML>



无标题文档 body {height:3000px;} #box {width:400px; height:300px; background:yellow; position:absolute; left:400px; top:200px;} #left {width:11px; height:11px; background:#000; right:0; bottom:0; position:absolute; cursor:nw-resize;} #right {width:11px; height:11px; background:#096; left:0; bottom:0; position:absolute; cursor:ne-resize;} #top {width:11px; height:11px; background:#096; left:0; top:0; position:absolute; cursor:nw-resize;} #bottom {width:11px; height:11px; background:#096; right:0; top:0; position:absolute; cursor:ne-resize;} .move {cursor:nw-resize;} window.onload=function () { var oBox=document.getElementById('box'); var Left=document.getElementById('left'); var Right=document.getElementById('right'); var Top=document.getElementById('top'); var Bottom=document.getElementById('bottom'); Left.onmousedown=function (ev) { var oEvent=ev||event; var disX=oEvent.clientX-Left.offsetLeft; var disY=oEvent.clientY-Left.offsetTop; document.onmousemove=function (ev) { var oEvent=ev||event; var l=oEvent.clientX-disX; var t=oEvent.clientY-disY; oBox.style.width=l+Left.offsetWidth+'px'; oBox.style.height=t+Left.offsetHeight+'px'; }; document.onmouseup=function () { document.onmousemove=null; document.onmouseup=null; }; return false; }; };


  • 写回答

1条回答 默认 最新

  • nomasp 领域专家: 算法与数据结构技术领域 2015-09-27 13:41
    关注

    这是什么鬼……代码不排版别人怎么看咯?

    评论

报告相同问题?