基于jquery的jqDnR拖拽溢出的修改


Posted in Javascript onFebruary 12, 2011
/* 
* jqDnR - Minimalistic Drag'n'Resize for jQuery. 
* 
* Copyright (c) 2007 Brice Burgess <bhb@iceburg.net>, http://www.iceburg.net/ 
* Licensed under the MIT License: 
* http://www.opensource.org/licenses/mit-license.php 
* 
* $Version: 2007.08.19 +r2 
* last modified by leegle 2011.02.11 
* fix bug:溢出之后不能回来的,添加在范围内移动 
*/ 
(function($) { 
$.fn.jqDrag = function(h) { return i(this, h, 'd'); }; 
$.fn.jqResize = function(h) { return i(this, h, 'r'); }; 
$.jqDnR = { dnr: {}, e: 0, 
drag: function(v) { 
if (M.k == 'd') { 
//修改的位置 李飞二?一一年二月十一日 14:35:19 
E.css({ left: (M.X + v.pageX - M.pX)<0? 0:(M.X + v.pageX - M.pX)<document.documentElement.clientWidth- M.W?(M.X + v.pageX - M.pX):document.documentElement.clientWidth- M.W, top: (M.Y + v.pageY - M.pY)<0?0:(M.Y + v.pageY - M.pY)<document.documentElement.clientHeight -M.H ?(M.Y + v.pageY - M.pY): document.documentElement.clientHeight- M.H }); 
} 
else {E.css({ width: Math.max(v.pageX - M.pX + M.W, 0), height: Math.max(v.pageY - M.pY + M.H, 0) }); return false;} 
}, 
stop: function() { E.css('opacity', M.o); $(document).unbind('mousemove', J.drag).unbind('mouseup', J.stop); } 
}; 
var J = $.jqDnR, M = J.dnr, E = J.e, 
i = function(e, h, k) { 
return e.each(function() { 
h = (h) ? $(h, e) : e; 
h.bind('mousedown', { e: e, k: k }, function(v) { 
var d = v.data, p = {}; E = d.e; 
// attempt utilization of dimensions plugin to fix IE issues 
if (E.css('position') != 'relative') { 
p = E.position(); 
if (!($.browser.msie && ($.browser.version == "6.0")) && (E.css('position') == 'fixed')) { 
p.top -= $(window).scrollTop(); p.left -= $(window).scrollLeft() 
} 
} 
M = { X: p.left || f('left') || 0, Y: p.top || f('top') || 0, W: f('width') || E[0].scrollWidth || 0, H: f('height') || E[0].scrollHeight || 0, pX: v.pageX, pY: v.pageY, k: d.k, o: E.css('opacity') }; 
E.css({ opacity: 0.8 }); $(document).mousemove($.jqDnR.drag).mouseup($.jqDnR.stop); 
return false; 
}); 
}); 
}, 
f = function(k) { return parseInt(E.css(k)) || false; }; 
})(jQuery);
Javascript 相关文章推荐
javascript 表单的友好用户体现
Jan 07 Javascript
Firefox window.close()的使用注意事项
Apr 11 Javascript
实现非常简单的js双向数据绑定
Nov 06 Javascript
js控住DOM实现发布微博效果
Aug 30 Javascript
详解react内联样式使用webpack将px转rem
Sep 13 Javascript
微信小程序页面上下滚动效果
Nov 18 Javascript
js 实现 list转换成tree的方法示例(数组到树)
Aug 18 Javascript
基于JS实现简单滑块拼图游戏
Oct 12 Javascript
vue实现鼠标移过出现下拉二级菜单功能
Dec 12 Javascript
Vue自定义表单内容检查rules实例
Oct 30 Javascript
微信小程序基于ColorUI构建皮皮虾短视频去水印组件
Nov 04 Javascript
在Vue中使用Echarts可视化库的完整步骤记录
Nov 18 Vue.js
jQuery1.4.2与老版本json格式兼容的解决方法
Feb 12 #Javascript
在vs2010中调试javascript代码方法
Feb 11 #Javascript
juqery 学习之六 CSS--css、位置、宽高
Feb 11 #Javascript
juqery 学习之五 文档处理 包裹、替换、删除、复制
Feb 11 #Javascript
juqery 学习之五 文档处理 插入
Feb 11 #Javascript
基于JQuery的浮动DIV显示提示信息并自动隐藏
Feb 11 #Javascript
Javascript面向对象之四 继承
Feb 08 #Javascript
You might like
深入探讨<br />和 \r\n两者有什么区别??
2013/06/05 PHP
php异步多线程swoole用法实例
2014/11/14 PHP
PHP使用php-resque库配合Redis实现MQ消息队列的教程
2016/06/29 PHP
js常见表单应用技巧
2008/01/09 Javascript
JavaScript学习笔记(一) js基本语法
2011/10/25 Javascript
二叉树的非递归后序遍历算法实例详解
2014/02/07 Javascript
jquery实现多行文字图片滚动效果示例代码
2014/10/10 Javascript
jQuery事件绑定和委托实例
2014/11/25 Javascript
JavaScript精炼之构造函数 Constructor及Constructor属性详解
2015/11/05 Javascript
AngularJS入门教程之静态模板详解
2016/08/18 Javascript
快速移动鼠标触发问题及解决方法(ECharts外部调用保存为图片操作及工作流接线mouseenter和mouseleave)
2016/08/29 Javascript
JS常用倒计时代码实例总结
2017/02/07 Javascript
JavaScript使用readAsDataURL读取图像文件
2017/05/10 Javascript
详解Vue.js基于$.ajax获取数据并与组件的data绑定
2017/05/26 Javascript
浅谈JavaScript find 方法不支持IE的问题
2017/09/28 Javascript
jQuery中元素选择器(element)简单用法示例
2018/05/14 jQuery
解决vue A对象赋值给B对象,修改B属性会影响到A的问题
2018/09/25 Javascript
iview同时验证多个表单问题总结
2018/09/29 Javascript
JavaScript时间日期操作实例小结【5个示例】
2018/12/22 Javascript
微信小程序实现点击空白隐藏的方法示例
2019/08/13 Javascript
使用js实现一个简单的滚动条过程解析
2019/09/10 Javascript
[06:23]2014DOTA2西雅图国际邀请赛 小组赛7月12日TOPPLAY
2014/07/12 DOTA
Python中Collections模块的Counter容器类使用教程
2016/05/31 Python
Windows安装Python、pip、easy_install的方法
2017/03/05 Python
Python字符串处理实现单词反转
2017/06/14 Python
python实现批量视频分帧、保存视频帧
2019/05/31 Python
HTML5 Canvas入门学习教程
2016/03/17 HTML / CSS
我的五年职业生涯规划
2014/01/23 职场文书
九年级英语教学反思
2014/01/31 职场文书
餐饮总经理岗位职责
2014/03/07 职场文书
机关门卫的岗位职责
2014/04/29 职场文书
中学教师暑期培训方案
2014/08/27 职场文书
企业务虚会发言材料
2014/10/20 职场文书
银行催款通知书
2015/04/17 职场文书
新人入职感言
2015/07/31 职场文书
劳保用品管理制度范本
2015/08/06 职场文书