dragBorder: function (parent, right, bottom, bottomRight) {
var isDownRight = false;
var isDownBottom = false; var doc = $(document);
var p = $('#' + parent);
var r = $('#' + right);
var b = $('#' + bottom);
var br = $('#' + bottomRight); var mouseStartPos = {}; r.mousedown(function (e) {
isDownRight = true;
mouseStartPos.x = e.clientX;
mouseStartPos.y = e.clientY;
});
b.mousedown(function (e) {
isDownBottom = true;
mouseStartPos.x = e.clientX;
mouseStartPos.y = e.clientY;
});
br.mousedown(function (e) {
isDownBottom = true;
isDownRight = true;
mouseStartPos.x = e.clientX;
mouseStartPos.y = e.clientY;
}); var opw = p.width();
doc.mousemove(function (e) {
// right
if (isDownRight) {
var l = e.clientX - mouseStartPos.x;
var w = parseInt(l) + parseInt(opw);
p.width(w);
}
});
var oph = p.height();
doc.mousemove(function (e) {
// bottom
if (isDownBottom) {
var t = e.clientY - mouseStartPos.y;
var h = parseInt(t) + parseInt(oph);
p.height(h);
}
});
doc.mousemove(function (e) {
// bottomRight
if (isDownBottom) {
var l = e.clientX - mouseStartPos.x;
var w = parseInt(l) + parseInt(opw);
p.weight(w);
var t = e.clientY - mouseStartPos.y;
var h = parseInt(t) + parseInt(oph);
p.height(h);
}
}); r.mouseup(function () {
isDownRight = false;
opw = p.width();
});
b.mouseup(function () {
isDownBottom = false;
oph = p.height();
});
br.mouseup(function () {
isDownBottom = false;
isDownRight = false;
opw = p.width();
oph = p.height();
});
}

  

this.dragBorder('chatWindow', 'chatRightGragClass', 'chatBottomGragClass', 'chatblockGragClass');

  

js 可拖动div 调整大小的更多相关文章

  1. JS实现拖动div层移动

    JS实现拖动div层移动 在谈到拖动div层之前,我们有必要来了解下 下面JS几个属性的区别----  pageX,pageY,layerX,layerY,clientX,clientY,screen ...

  2. vue实现拖动div元素

    html: <div id="app1"> <div v-drag class="drag"></div> <div ...

  3. js实现可拖动Div

    随着时代的变化,越来越感觉到js的重要性,js不仅可以做web页面(如Ext框架),还可以做一些web的特效,这些特效不仅兼容PC,而且兼容手机端,毕竟是基于浏览器的,和平台没关系.现在微软的wind ...

  4. JS拖动DIV布局

    方法一: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...

  5. javascript拖动div

    div拖动代码,在用此代码之前,你可能需要将你需要拖动的元素style设置position: absolute; #textareaSavaDiv{ position: absolute; right ...

  6. easyUI draggable插件使用不当,导致拖动div内部文本框无法输入;设置echarts数据为空时就显示空白,不要动画和文字

    先上一个Demo <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://ww ...

  7. [可拖动DIV]刚开通博客顺便就写了点东西!

    说说我自己的思路 首先需要一个初始div div { border: 1px #333 solid; width: 200px; height: 50px; } <div id="od ...

  8. 利用修改div的位置+js对象存储div信息 实现简单的div自定义布局功能

    原文:利用修改div的位置+js对象存储div信息 实现简单的div自定义布局功能 利用修改div的位置+js对象存储div信息 实现简单的div自定义布局功能1.在界面上添加几个checkbox和一 ...

  9. 拖动DIV

    链接:https://www.cnblogs.com/joyco773/p/6519668.html   移动端:div在手机页面上随意拖动   1 <!doctype html> 2 & ...

随机推荐

  1. 1489 ACM 贪心

    题目:http://acm.hdu.edu.cn/showproblem.php?pid=1489 题意:为负数表示买酒,正数表示买酒,每两家人之间为one unit of work.问最小的work ...

  2. windows安装channels报错的解决方案

    windows作为开发机真是让人又爱又恨,总是会遇到各种各样的问题 报错 以安装channels为例:如: pip install channels   时出现: error: Microsoft V ...

  3. HQL实用技术

    HQL是Hibernate Query Language的缩写,提供更加丰富灵活.更为强大的查询能力:HQL更接近SQL语句查询语法. HQL基础查询  1.获取部分列 多列 /** * 获取部分列 ...

  4. MySQL数据库引擎MyISAM和InnoDB的区别介绍

    MySQL数据库有多种存储引擎:比如:MyISAM.InnoDB.MERGE.MEMORY(HEAP).BDB(BerkeleyDB).EXAMPLE.FEDERATED.ARCHIVE.CSV.BL ...

  5. spring中的多线程aop方法拦截

    日常开发中,常用spring的aop机制来拦截方法,记点日志.执行结果.方法执行时间啥的,很是方便,比如下面这样:(以spring-boot项目为例) 一.先定义一个Aspect import org ...

  6. C#实战技能之WebApi+Task+WebSocket

    一.背景介绍 环境的局限性: 用户在使用XX客户端的时候,必须每台电脑都安装打印组件,同时由于XX客户端使用的是 websocket进行通讯,这就必须限制用户的电脑浏览器必须是IE10.0+以上版本, ...

  7. React进阶之高阶组件

    前言 本文代码浅显易懂,思想深入实用.此属于react进阶用法,如果你还不了解react,建议从文档开始看起. 我们都知道高阶函数是什么, 高阶组件其实是差不多的用法,只不过传入的参数变成了react ...

  8. Your project is not referencing the ".NETPortable,Version=v4.5,Profile=Profile259" framework. Add a reference to ".NETPortable,Version=v4.5,Profile=Profile259" in the "frameworks" section of your proj

    i want to add nuget packages to my portable class library project , then i add a project.json to my ...

  9. Mysql取随机数据效率测试(200W条中读取100条)

    第一种方案: SELECT * FROM `follow_record` AS t1 JOIN (SELECT ROUND(RAND() * ((SELECT MAX(record_id) FROM ...

  10. 分享一个整理Mac储存空间的软件,有效清理xcode的垃圾

    苹果的电脑还是比windows的要好,我这台用了3年时间,作为编程工作天天用,现在愣是一点儿也没有卡顿,如果换作是windows的电脑,我敢保证肯定是卡成狗,相信做编程的你肯定少补了一台mac. ma ...