完美拖拽+拖动改变Div的宽高+关闭按钮

本文介绍如何通过JavaScript实现一个功能完善的拖拽Div功能,包括拖动改变Div的宽度和高度,并集成了关闭按钮操作。示例代码:dragBox('div1','box','h2','right','','')。" 111965514,10553448,MongoDB权限管理与Python、Java登录实践,"['数据库管理', 'Python', 'MongoDB', 'Java']
摘要由CSDN通过智能技术生成
/**
 * Created by Spades-k on 2016/8/17.
 */
define('h5/js/page/imageMagnification', [
    'jquery'
],function($){
    var dragBox=function(rddrag,selector,drag,right,bottom,close){
        var oDiv=document.getElementById(rddrag);
        var oDiv2=document.getElementById(selector);
        var h2=document.getElementById(drag);
        var right=document.getElementById(right);
        var bottom=document.getElementById(bottom);
        var sClose=document.getElementById(close);
        var mouseStart={};
        var divStart={};
        var rightStart={};
        var bottomStart={};
        //往右拽
        right.onmousedown=function(ev)
        {
            var oEvent=ev||event;
            mouseStart.x=oEvent.clientX;
            mouseStart.y=oEvent.clientY;
            rightStart.x=right.offsetLeft;
            if(right.setCapture)
            {
                right.onmousemove=doDrag1;
                right.onmouseup=stopDrag1;
                right.setCapture();
            }
            else
            {
                document.addEventListener("mousemove",doDrag1,true);
                document.addEventListener("mouseup",stopDrag1,true);
            }
        };
        function doDrag1(ev)
        {
            var oEvent=ev||event;
            var l=oEvent.clientX-mouseStart.x+rightStart.x;
            var w=l+oDiv.offsetWidth;
            if(w<oDiv.offsetWidth)
            {
                w=oDiv.offsetWidth;
            }
            else if(w>document.documentElement.clientWi
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值