资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
JS拖拽的进一步练习,移动与拉伸实现代码
直接在本地是支持IE6的,有个问题就是,鼠标点击的时候光标会变为选择文字的光标,不知道应该怎么处理这个问题呢?
在此记录一下代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>简单拖拽扩展</title> <style type="text/css"> *{margin:0;padding:0;} #outwarp{ margin:20px auto; width:600px; height:600px; background:#fff; border:1px solid #333; position: relative; } .controlBox{ width:200px; height:200px; position: absolute; left:25px; top:50px; background:#ccc; font-size:12px; color:#fff; border: 1px solid #333;} .controlBar{cursor: move;} .controlBar h2{ font-size:12px; text-align: center; line-height: 25px; background: blue;} .innerCon{text-align: left; line-height: 20px;} .innerCon p{ padding: 10px; color: #000;} .resize{ position: absolute; height: 10px; width:10px; color: white; z-index: 10; background: red;} .lt{left:0;right:0; cursor:nw-resize;} .tr{right:0;top: 0;cursor:ne-resize;} .rb{right:0;bottom: 0; cursor:nw-resize;} .bl{left:0;bottom:0;cursor:ne-resize;} </style> </head> <body> <div id="outwarp"> <div class="controlBox"> <div class="resize lt"></div> <div class="resize tr"></div> <div class="resize rb"></div> <div class="resize bl"></div> <div class="controlBar"> <h2>按此处拖动</h2> </div> <div class="innerCon"> <p>中间内容中间内容中间内容中间内容中间内容中间内容中间内容中间内容中间内容中间内容中间 内容中间内容中间内容中间内容中间内容中间内容中间内容中间内容中间内容中间内容中间内容中间内容 中间内容中间内容中间内容中间内容中间内容中间内容</p> </div> </div> </div> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%20%0D%0A(function%20()%20%7B%20%0D%0A%2F%2F%E5%AE%9A%E4%B9%89%E4%BE%BF%E6%8D%B7%E5%87%BD%E6%95%B0getElementById%2CgetElementsByTagName%2CgetElementsByClassName%2CbindFunction%2CbindEvent%20%0D%0Afunction%20%24()%20%7B%20%0D%0Avar%20elements%20%3D%20new%20Array()%3B%20%0D%0Afor%20(var%20i%20%3D%200%3B%20i%20%3C%20arguments.length%3B%20i%2B%2B)%20%7B%20%0D%0Avar%20element%20%3D%20arguments%5Bi%5D%3B%20%0D%0Aif%20(typeof%20element%20%3D%3D%20'string')%20%7B%20%0D%0Aelement%20%3D%20document.getElementById(element)%3B%20%0D%0A%7D%20%0D%0Aif%20(!element)%20%7B%20%0D%0Acontinue%3B%20%0D%0A%7D%20%0D%0Aif%20(arguments.length%20%3D%3D%201)%20%7B%20%0D%0Areturn%20element%3B%20%0D%0A%7D%20%0D%0Aelements.push(element)%3B%20%0D%0A%7D%20%0D%0Areturn%20elements%3B%20%0D%0A%7D%20%0D%0Afunction%20%24%24(tag%2C%20parent)%20%7B%20%0D%0Aparent%20%3D%20parent%20%7C%7C%20document%3B%20%0D%0Areturn%20%24(parent).getElementsByTagName(tag)%3B%20%0D%0A%7D%20%0D%0Afunction%20%24%24%24(str%2C%20parent%2C%20tag)%20%7B%20%0D%0Aif%20(parent)%20%7B%20%0D%0Aparent%20%3D%20%24(parent)%3B%20%0D%0A%7D%20else%20%7B%20%0D%0Aparent%20%3D%20document%3B%20%0D%0A%7D%20%0D%0Atag%20%3D%20tag%20%7C%7C%20'*'%3B%20%0D%0Avar%20els%20%3D%20parent.getElementsByTagName(tag)%2C%20%0D%0Aarr%20%3D%20%5B%5D%3B%20%0D%0Afor%20(var%20i%20%3D%200%2C%20n%20%3D%20els.length%3B%20i%20%3C%20n%3B%20i%2B%2B)%20%7B%20%0D%0Afor%20(var%20j%20%3D%200%2C%20k%20%3D%20els%5Bi%5D.className.split('%20')%2C%20l%20%3D%20k.length%3B%20j%20%3C%20l%3B%20j%2B%2B)%20%7B%20%0D%0Aif%20(k%5Bj%5D%20%3D%3D%20str)%20%7B%20%0D%0Aarr.push(els%5Bi%5D)%3B%20%0D%0Abreak%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Areturn%20arr%3B%20%0D%0A%7D%20%0D%0Afunction%20bindFunction(obj%2C%20func)%20%7B%20%0D%0Areturn%20function%20()%20%7B%20%0D%0Areturn%20func.apply(obj%2C%20arguments)%3B%20%0D%0A%7D%3B%20%0D%0A%7D%20%0D%0Afunction%20bindEvent(element%2C%20type%2C%20func)%20%7B%20%0D%0Aif%20(element.addEventListener)%20%7B%20%0D%0Aelement.addEventListener(type%2C%20func%2C%20false)%3B%20%2F%2Ffalse%20%E8%A1%A8%E7%A4%BA%E5%86%92%E6%B3%A1%20%0D%0A%7D%20else%20if%20(element.attachEvent)%20%7B%20%0D%0Aelement.attachEvent('on'%20%2B%20type%2C%20func)%3B%20%0D%0A%7D%20else%20%7B%20%0D%0Aelement%5B'on'%20%2B%20type%5D%20%3D%20func%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%2F*%E5%AE%9A%E4%B9%89%E6%8B%96%E6%8B%BD%E7%B1%BB*%2F%20%0D%0Avar%20DragBox%20%3D%20function%20(options)%20%7B%20%0D%0Avar%20outWarpId%20%3D%20this.outWarpId%20%3D%20options.outWarpId%3B%2F%2F%E8%8E%B7%E5%8F%96%E6%9C%80%E5%A4%96%E5%9B%B4%E7%9A%84%E5%8C%85%E8%A3%B9%E5%B1%82ID%20%0D%0Avar%20outWarp%20%3D%20%24(outWarpId)%3B%2F%2F%E8%8E%B7%E5%8F%96%E5%A4%96%E5%9B%B4%E5%8C%85%E8%A3%B9%E5%B1%82%E5%AF%B9%E8%B1%A1%20%0D%0Avar%20controlBox%20%3D%20this.controlBox%20%3D%20%24%24%24('controlBox'%2C%20outWarp%2C%20'div')%5B0%5D%3B%20%2F%2F%E8%A2%AB%E6%8B%96%E5%8A%A8%E7%9A%84%E5%B1%82%20%0D%0Athis.controlBar%20%3D%20%24%24%24('controlBar'%2C%20controlBox%2C%20'div')%5B0%5D%3B%20%0D%0Athis.resizeLt%20%3D%20%24%24%24('lt'%2C%20controlBox%2C%20'div')%5B0%5D%3B%20%0D%0Athis.resizeTr%20%3D%20%24%24%24('tr'%2C%20controlBox%2C%20'div')%5B0%5D%3B%20%0D%0Athis.resizeRb%20%3D%20%24%24%24('rb'%2C%20controlBox%2C%20'div')%5B0%5D%3B%20%0D%0Athis.resizeBl%20%3D%20%24%24%24('bl'%2C%20controlBox%2C%20'div')%5B0%5D%3B%20%0D%0A%2F*%E8%8E%B7%E5%8F%96outWarpId%E4%BF%A1%E6%81%AF*%2F%20%0D%0Athis.warpWidth%20%3D%20outWarp.offsetWidth%20-%202%3B%20%2F%2F%20%E5%AF%B9%E8%B1%A1%E5%AE%BD%E5%BA%A6%20%0D%0Athis.warpHeight%20%3D%20outWarp.offsetHeight%20-%202%3B%20%2F%2F%20%E5%AF%B9%E8%B1%A1%E9%AB%98%E5%BA%A6%20%0D%0Athis.warpLeft%20%3D%20outWarp.offsetLeft%3B%20%2F%2F%E5%AF%B9%E8%B1%A1%E9%9D%A0LEFT%E8%B7%9D%E7%A6%BB%20%0D%0Athis.warpTop%20%3D%20outWarp.offsetTop%3B%20%2F%2F%E5%AF%B9%E8%B1%A1%E9%9D%A0TOP%E8%B7%9D%E7%A6%BB%20%0D%0A%2F*%E5%AE%9A%E4%B9%89%E6%8B%96%E5%8A%A8%E7%9A%84%E5%AF%B9%E8%B1%A1*%2F%20%0D%0Athis.draging%20%3D%20null%3B%20%0D%0Athis.bind()%3B%20%0D%0A%7D%3B%20%0D%0ADragBox.prototype%20%3D%20%7B%20%0D%0AmoveBox%3Afunction%20(event)%20%7B%20%0D%0Aevent%20%3D%20event%20%7C%7C%20window.event%3B%20%0D%0Avar%20target%20%3D%20event.target%20%7C%7C%20event.srcElement%3B%20%0D%0A%2F%2F%20%E8%AE%B0%E5%BD%95%E6%BB%9A%E5%8A%A8%E6%9D%A1%E4%BD%8D%E7%BD%AE%20%0D%0Athis.scrollTop%20%3D%20document.documentElement.scrollTop%20%7C%7C%20document.body.scrollTop%3B%20%0D%0Athis.scrollLeft%20%3D%20document.documentElement.scrollLeft%20%7C%7C%20document.body.scrollLeft%3B%20%0D%0A%2F%2F%E8%AE%B0%E5%BD%95%E5%85%89%E6%A0%87%E7%9A%84%E4%BD%8D%E7%BD%AE%20%0D%0Avar%20mousex%20%3D%20event.clientX%3B%20%2F%2F%20%E5%85%89%E6%A0%87LEFT%20%0D%0Avar%20mousey%20%3D%20event.clientY%3B%20%2F%2F%E5%85%89%E6%A0%87TOP%20%0D%0A%2F%2Fconsole.log('mousex%3A'%20%2B%20mousex)%3B%20%0D%0A%2F%2Fconsole.log('mousey%3A'%20%2B%20mousey)%3B%20%0D%0A%0D%0A%2F%2F%20%E5%85%89%E6%A0%87%E7%9B%B8%E5%AF%B9outwarp%E5%B1%82%E7%9A%84%E5%9D%90%E6%A0%87%20%0D%0Avar%20posx%20%3D%20mousex%20%2B%20this.scrollLeft%20-%20this.warpLeft%3B%20%0D%0Avar%20posy%20%3D%20mousey%20%2B%20this.scrollTop%20-%20this.warpTop%3B%20%0D%0A%2F%2F%20%E5%A4%9A%E6%AC%A1%E7%94%A8%E5%88%B0this.controlBox%20%E8%B5%8B%E5%80%BC%E4%B8%80%E4%B8%AA%E7%9F%AD%E5%8F%98%E9%87%8F%E5%90%8D%20%0D%0Avar%20my%20%3D%20this.controlBox%3B%20%0D%0A%2F%2F%20%E5%A4%9A%E6%AC%A1%E7%94%A8%E5%88%B0this.controlBox.style%EF%BC%8C%E8%B5%8B%E5%80%BC%E4%B8%80%E4%B8%AA%E7%9F%AD%E5%8F%98%E9%87%8F%E5%90%8D%20%0D%0Avar%20myStyle%20%3D%20my.style%3B%20%0D%0A%2F%2F%20%E6%9C%80%E5%B0%8F%E5%B0%BA%E5%AF%B8%20%0D%0Avar%20minWidth%20%3D%20200%2CminHeight%20%3D%20200%3B%20%0D%0Aswitch(event.type)%7B%20%0D%0Acase%20'mousedown'%3A%20%0D%0A%2F*%E8%AE%B0%E5%BD%95%E7%9B%B8%E5%85%B3%E5%88%9D%E5%A7%8B%E4%BF%A1%E6%81%AF*%2F%20%0D%0Aif(target.parentNode.className.indexOf('controlBar')!%3D-1)%7B%20%0D%0Athis.draging%20%3D%20this.controlBox%3B%20%2F%2F%E8%B5%8B%E5%80%BC%E6%8B%96%E5%8A%A8%E5%AF%B9%E8%B1%A1%20%0D%0A%7D%20%0D%0Aif(target.className.indexOf('rb')!%3D%20-1)%7B%20%0D%0Athis.draging%20%3D%20this.resizeRb%3B%20%2F%2F%20%E8%B5%8B%E5%80%BC%E4%B8%BA%E5%8F%B3%E4%B8%8B%E8%A7%92%E6%8B%96%E5%8A%A8%20%0D%0A%7D%20%0D%0Aif(target.className.indexOf('tr')!%3D%20-1)%7B%20%0D%0Athis.draging%20%3D%20this.resizeTr%3B%20%2F%2F%20%E8%B5%8B%E5%80%BC%E4%B8%BA%E5%8F%B3%E4%B8%8A%E8%A7%92%E6%94%B9%E5%8F%98%E5%A4%A7%E5%B0%8F%20%0D%0A%7D%20%0D%0Aif(target.className.indexOf('lt')!%3D%20-1)%7B%20%0D%0Athis.draging%20%3D%20this.resizeLt%3B%20%2F%2F%20%E8%B5%8B%E5%80%BC%E4%B8%BA%E5%B7%A6%E4%B8%8A%E8%A7%92%E6%94%B9%E5%8F%98%E5%A4%A7%E5%B0%8F%20%0D%0A%7D%20%0D%0Aif(target.className.indexOf('bl')%20!%3D%20-1)%7B%20%0D%0Athis.draging%20%3D%20this.resizeBl%3B%20%0D%0A%7D%20%0D%0A%0D%0A%2F%2Falert('this.scrollTop%3A'%2Bthis.scrollTop)%3B%20%0D%0A%2F%2F%E7%82%B9%E5%87%BB%E6%97%B6%E8%AE%B0%E5%BD%95%E6%8B%96%E5%8A%A8%E5%B1%82%E7%9A%84%E5%88%9D%E5%A7%8B%E4%BF%A1%E6%81%AF%20%0D%0Athis.controlBoxWidth%20%3D%20my.offsetWidth%3B%20%2F%2F%E6%8B%96%E5%8A%A8%E5%B1%82%E7%9A%84%E5%AE%BD%E5%BA%A6%20%0D%0Athis.controlBoxHeight%20%3D%20my.offsetHeight%3B%20%2F%2F%E6%8B%96%E5%8A%A8%E5%B1%82%E7%9A%84%E5%AE%BD%E5%BA%A6%20%0D%0Athis.controlBoxLeft%20%3D%20my.offsetLeft%3B%20%2F%2F%E6%8B%96%E5%8A%A8%E5%B1%82%E7%9A%84LEFT%E5%9D%90%E6%A0%87%20%0D%0Athis.controlBoxTop%20%3D%20my.offsetTop%3B%20%2F%2F%E6%8B%96%E5%8A%A8%E5%B1%82%E7%9A%84TOP%E5%9D%90%E6%A0%87%20%0D%0A%2F%2F%20%E8%AE%B0%E5%BD%95%E9%BC%A0%E6%A0%87%E6%8C%89%E4%B8%8B%E6%97%B6%E9%BC%A0%E6%A0%87%E7%9B%B8%E5%AF%B9%E4%B8%8E%E6%8B%96%E5%8A%A8%E5%B1%82%E7%9A%84%E8%B7%9D%E7%A6%BB%20%0D%0Athis.mx%20%3D%20posx%20-%20this.controlBoxLeft%3B%20%0D%0Athis.my%20%3D%20posy%20-%20this.controlBoxTop%3B%20%0D%0A%2F%2F%20%E8%AE%B0%E5%BD%95%E5%B7%A6%E4%B8%8B%E8%A7%92%E7%9A%84%E5%9D%90%E6%A0%87%EF%BC%8C%E5%9B%A0%E4%B8%BA%E6%8C%89%E4%BD%8F%E5%8F%B3%E4%B8%8A%E6%8B%96%E5%8A%A8%E7%9A%84%E6%97%B6%E5%80%99%E5%B7%A6%E4%B8%8B%E8%A7%92%E4%B8%8D%E5%8A%A8%20%0D%0Athis.lb_x%20%3D%20my.offsetWidth%20%2B%20my.offsetLeft%3B%20%0D%0Athis.lb_y%20%3D%20my.offsetHeight%20%2B%20my.offsetTop%3B%20%0D%0Aconsole.log('my.offsetHeight%3A'%2Bmy.offsetHeight%2B'my.offsetTop%3A'%2Bmy.offsetTop)%3B%20%0D%0A%2F%2F%20%E8%AE%B0%E5%BD%95%E5%8F%B3%E4%B8%8B%E8%A7%92%E5%9D%90%E6%A0%87%EF%BC%8C%E6%8C%89%E4%BD%8F%E5%B7%A6%E4%B8%8A%E8%A7%92%E6%8B%96%E5%8A%A8%E7%9A%84%E6%97%B6%E5%80%99%E5%8F%B3%E4%B8%8B%E8%A7%92%E4%B8%8D%E5%8A%A8%20%0D%0Athis.rb_x%20%3D%20my.offsetLeft%20%2B%20my.offsetWidth%3B%20%0D%0Athis.rb_y%20%3D%20my.offsetTop%20%2B%20my.offsetHeight%3B%20%0D%0A%2F%2F%20%E8%AE%B0%E5%BD%95%E5%8F%B3%E4%B8%8A%E8%A7%92%E5%9D%90%E6%A0%87%EF%BC%8C%E5%BD%93%E6%8C%89%E4%BD%8F%E5%B7%A6%E4%B8%8B%E8%A7%92%E7%9A%84%E6%97%B6%E5%80%99%E5%8F%B3%E4%B8%8A%E8%A7%92%E4%B8%8D%E5%8A%A8%20%0D%0Athis.lt_x%20%3D%20my.offsetLeft%20%2B%20my.offsetWidth%3B%20%0D%0Athis.lt_y%20%3D%20my.offsetTop%3B%20%0D%0Abreak%3B%20%0D%0Acase%20'mousemove'%3A%20%0D%0Aif%20(this.draging%20%3D%3D%20this.controlBox)%7B%20%0D%0Awindow.getSelection%20%3F%20window.getSelection().removeAllRanges()%20%3A%20document.selection.empty()%3B%20%2F%2F%E5%8F%96%E6%B6%88%E9%A1%B5%E9%9D%A2%E4%B8%8A%E7%94%B1%E4%BA%8E%E9%BC%A0%E6%A0%87%E6%8C%89%E4%B8%8B%E6%8B%96%E5%8A%A8%E9%80%A0%E6%88%90%E7%9A%84%E9%80%89%E4%B8%AD%E6%96%87%E5%AD%97%E5%92%8C%E5%9B%BE%E7%89%87%E7%9A%84%E9%80%89%E6%8B%A9%E7%8A%B6%E6%80%81%20%0D%0A%2F%2F%E6%8B%96%E5%8A%A8%E5%B1%82%E7%9A%84%E4%BD%8D%E7%BD%AE%20%0D%0Avar%20left%20%3D%20posx%20-%20this.mx%3B%20%0D%0Avar%20top%20%3D%20posy%20-%20this.my%3B%20%0D%0Aleft%20%3C%200%20%26%26%20(left%20%3D%200)%3B%20%0D%0Atop%20%3C%200%20%26%26%20(top%20%3D%200)%3B%20%0D%0Aleft%20%3E%20(this.warpWidth%20-%20this.controlBoxWidth)%20%26%26%20(left%20%3D%20this.warpWidth%20-%20this.controlBoxWidth)%3B%20%0D%0Atop%20%3E%20(this.warpHeight%20-%20this.controlBoxHeight)%20%26%26%20(top%20%3D%20this.warpHeight%20-%20this.controlBoxHeight)%3B%20%0D%0A%2F%2F%E6%94%B9%E5%8F%98%E4%BD%8D%E7%BD%AE%20%0D%0AmyStyle.left%20%3D%20left%20%2B%20'px'%3B%20%0D%0AmyStyle.top%20%3D%20top%20%2B%20'px'%3B%20%0D%0A%2F%2F%E5%8F%B3%E4%B8%8B%E8%A7%92%E6%8B%96%E5%8A%A8%20%0D%0A%7D%20else%20if%20(this.draging%20%3D%3D%20this.resizeRb)%20%7B%20%0D%0A%2F%2F%20%E9%9C%80%E8%A6%81%E6%94%B9%E5%8F%98%E7%9A%84%E5%AE%BD%E5%BA%A6%20%0D%0Avar%20changeWidth%20%3D%20posx%20-%20this.controlBoxWidth%20-%20this.controlBoxLeft%2C%20%0D%0AchangeHeight%20%3D%20posy%20-%20this.controlBoxHeight%20-%20this.controlBoxTop%2C%20%0D%0A%2F%2F%20%E8%AE%A1%E7%AE%97%E6%80%BB%E5%AE%BD%E5%BA%A6%20%0D%0AallWidth%20%3D%20this.controlBoxWidth%20%2B%20changeWidth%20%2B%20this.controlBoxLeft%20%2C%20%0D%0AallHeight%20%3D%20this.controlBoxHeight%20%2B%20changeHeight%20%2B%20this.controlBoxTop%3B%20%0D%0A%2F%2F%E6%94%B9%E5%8F%98%E5%AE%BD%E5%BA%A6%20%0D%0AmyStyle.width%20%3D%20(this.controlBoxWidth%20%2B%20changeWidth)%20%2B%20'px'%3B%20%0D%0AmyStyle.height%20%3D%20(this.controlBoxHeight%20%2B%20changeHeight)%20%2B%20'px'%3B%20%0D%0A%2F%2F%20%E9%99%90%E5%88%B6%E6%9C%80%E5%A4%A7%E5%AE%BD%E5%BA%A6%20%0D%0Aif%20(allWidth%20%3E%20this.warpWidth)%20%7B%20%0D%0AmyStyle.width%20%3D%20(%20this.warpWidth%20-%20this.controlBoxLeft)%20%2B%20'px'%3B%20%0D%0A%7D%20%0D%0Aif%20(allHeight%20%3E%20this.warpHeight)%20%7B%20%0D%0AmyStyle.height%20%3D%20(this.warpHeight%20-%20this.controlBoxTop)%20%2B%20'px'%3B%20%0D%0A%7D%20%0D%0A%2F%2F%20%E9%99%90%E5%88%B6%E6%9C%80%E5%B0%8F%E5%AE%BD%E5%BA%A6%20%0D%0Aif%20(%20parseInt(myStyle.width)%20%3C%20minWidth)myStyle.width%20%3D%20minWidth%20%2B%20'px'%3B%20%0D%0Aif%20(parseInt(myStyle.height)%20%3C%20minHeight)%20myStyle.height%20%3D%20minHeight%20%2B%20'px'%3B%20%0D%0A%2F%2F%20%E5%8F%B3%E4%B8%8A%E8%A7%92%20%0D%0A%7D%20else%20if%20(this.draging%20%3D%3D%20this.resizeTr)%20%7B%20%0D%0A%2F%2F%20%E9%9C%80%E8%A6%81%E6%94%B9%E5%8F%98%E7%9A%84%E5%AE%BD%E5%BA%A6%EF%BC%8C%E8%AF%A5%E5%8F%98%E9%AB%98%E5%BA%A6%E5%8D%B3%E6%94%B9%E5%8F%98TOP%E7%9A%84%E5%9D%90%E6%A0%87%20%0D%0AchangeWidth%20%3D%20posx%20-%20this.controlBoxWidth%20-%20this.controlBoxLeft%3B%20%0D%0A%2F%2F%20%E8%AE%A1%E7%AE%97%E6%80%BB%E5%AE%BD%E5%BA%A6%20%0D%0AallWidth%20%3D%20this.controlBoxWidth%20%2B%20changeWidth%20%2B%20this.controlBoxLeft%3B%20%0D%0A%2F%2F%20%E6%94%B9%E5%8F%98%E5%AE%BD%E5%BA%A6%20%0D%0AmyStyle.width%20%3D%20(this.controlBoxWidth%20%2B%20changeWidth)%20%2B%20'px'%3B%20%0D%0Aif%20(allWidth%20%3E%20this.warpWidth)%20myStyle.width%20%3D%20(%20this.warpWidth%20-%20this.controlBoxLeft)%20%2B%20'px'%3B%20%0D%0Aif%20(%20parseInt(myStyle.width)%20%3C%20minWidth)%20myStyle.width%20%3D%20minWidth%20%2B%20'px'%3B%20%0D%0A%2F%2F%20%E6%94%B9%E5%8F%98%E9%AB%98%E5%BA%A6%20%0D%0Amy.style.top%20%3D%20posy%20%2B%20'px'%3B%20%0D%0Amy.style.height%20%3D%20(this.controlBoxHeight%20%2B%20(this.controlBoxTop%20-%20posy))%20%2B'px'%3B%20%0D%0Aif(parseInt(my.style.height)%3C%20minHeight)%7B%20%0D%0Amy.style.height%20%3D%20minHeight%20%2B'px'%3B%20%0D%0Amy.style.top%20%3D%20(this.lb_y%20-%20minHeight)%20%2B%20'px'%3B%20%0D%0A%7D%20%0D%0Aif(parseInt(my.style.height)%3Ethis.lb_y)%7B%20%0D%0Amy.style.height%20%3D%20this.lb_y%20%2B%20'px'%3B%20%0D%0Amy.style.top%20%3D%200%3B%20%0D%0A%7D%20%0D%0A%2F%2F%20%E5%B7%A6%E4%B8%8A%E8%A7%92%20%0D%0A%7Delse%20if%20(this.draging%20%3D%3D%20this.resizeLt)%20%7B%20%0D%0AchangeWidth%20%3D%20this.controlBoxLeft%20-%20posx%3B%20%0D%0AchangeHeight%20%3D%20this.controlBoxTop%20-%20posy%3B%20%0D%0Amy.style.left%20%3D%20posx%20%2B%20'px'%3B%20%0D%0Amy.style.width%20%3D%20(this.controlBoxWidth%20%2B%20changeWidth)%20%2B%20'px'%3B%20%0D%0Amy.style.top%20%3D%20posy%20%2B%20'px'%3B%20%0D%0Amy.style.height%20%3D%20(this.controlBoxHeight%20%2B%20changeHeight)%20%2B%20'px'%3B%20%0D%0A%2F%2F%20%E9%99%90%E5%88%B6%E5%AE%BD%E9%AB%98%E5%BA%A6%E6%9C%80%E5%A4%A7%E5%80%BC%20%0D%0Aif(parseInt(my.style.width)%20%3E%20this.controlBoxLeft%20%2B%20this.controlBoxWidth)%7B%20%0D%0Amy.style.width%20%3D%20(this.controlBoxLeft%20%2B%20this.controlBoxWidth)%20%2B%20'px'%3B%20%0D%0Amy.style.left%20%3D%200%3B%20%0D%0A%7Delse%20if(parseInt(my.style.width)%3C%20minWidth)%7B%20%0D%0Amy.style.left%20%3D%20(this.rb_x%20-%20minWidth)%20%2B%20'px'%3B%20%0D%0Amy.style.width%20%3D%20minWidth%20%2B%20'px'%3B%20%0D%0A%7D%20%0D%0Aif(parseInt(my.style.height)%20%3E%20this.controlBoxHeight%20%2B%20this.controlBoxTop)%7B%20%0D%0Amy.style.height%20%3D%20(this.controlBoxHeight%20%2B%20this.controlBoxTop)%20%2B%20'px'%3B%20%0D%0Aif(parseInt(my.style.top)%3C0)%20my.style.top%20%3D%200%3B%20%0D%0A%7Delse%20if(parseInt(my.style.height)%3C%20minHeight)%7B%20%0D%0Amy.style.top%20%3D%20(this.rb_y%20-%20minHeight)%20%2B%20'px'%3B%20%0D%0Amy.style.height%20%3D%20minHeight%20%2B%20'px'%3B%20%0D%0A%7D%20%0D%0A%2F%2F%20%E5%B7%A6%E4%B8%8B%E8%A7%92%20%0D%0A%7Delse%20if(this.draging%20%3D%3D%20this.resizeBl)%7B%20%0D%0AchangeWidth%20%3D%20this.controlBoxLeft%20-%20posx%3B%20%0D%0AchangeHeight%20%3D%20posy%20-%20this.controlBoxHeight%20-%20this.controlBoxTop%3B%20%0D%0Amy.style.left%20%3D%20posx%20%2B%20'px'%3B%20%0D%0Amy.style.width%20%3D%20this.controlBoxWidth%20%2B%20changeWidth%20%2B%20'px'%3B%20%0D%0Amy.style.height%20%3D%20this.controlBoxHeight%20%2B%20changeHeight%20%2B%20'px'%3B%20%0D%0Aif(parseInt(my.style.width)%3C%20minWidth)%7B%20%0D%0Amy.style.width%20%3D%20minWidth%20%2B%20'px'%3B%20%0D%0Amy.style.left%20%3D%20this.lt_x%20-%20minWidth%20%2B%20'px'%3B%20%0D%0A%7Delse%20if(parseInt(my.style.width)%3E%20this.lt_x)%7B%20%0D%0Amy.style.width%20%3D%20this.lt_x%20%2B%20'px'%3B%20%0D%0Amy.style.left%20%3D%200%3B%20%0D%0A%7D%20%0D%0Aif(parseInt(my.style.height)%3C%20minHeight)%7B%20%0D%0Amy.style.height%20%3D%20minHeight%20%2B%20'px'%3B%20%0D%0A%7Delse%20if(parseInt(my.style.height)%3E%20this.warpHeight-%20this.lt_y)%7B%20%0D%0Amy.style.height%20%3D%20this.warpHeight-%20this.lt_y%20%2B'px'%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Abreak%3B%20%0D%0A%0D%0Acase%20'mouseup'%3A%20%0D%0Athis.draging%20%3D%20null%3B%20%0D%0Abreak%3B%20%0D%0A%7D%20%0D%0A%7D%2C%20%0D%0Abind%3Afunction%20()%20%7B%20%0D%0Avar%20that%20%3D%20this%3B%20%0D%0AbindEvent(document%2C%20'mousedown'%2C%20bindFunction(that%2Cthat.moveBox))%3B%20%0D%0AbindEvent(document%2C%20'mousemove'%2C%20bindFunction(that%2Cthat.moveBox))%3B%20%0D%0AbindEvent(document%2C%20'mouseup'%2C%20bindFunction(that%2Cthat.moveBox))%3B%20%0D%0A%7D%20%0D%0A%7D%3B%20%0D%0Avar%20demo%20%3D%20new%20DragBox(%7B%20%0D%0AoutWarpId%3A'outwarp'%20%0D%0A%7D)%3B%20%0D%0A%7D)()%20%0D%0A%3C%2Fscript%3E"> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程