基于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 不能释放内存.
Sep 07 Javascript
js遍历td tr等html元素
Dec 13 Javascript
jquery实现div阴影效果示例代码
Sep 16 Javascript
js实现文件上传表单域美化特效
Nov 02 Javascript
js操作数组函数实例小结
Dec 10 Javascript
jQuery进行组件开发完整实例
Dec 15 Javascript
Knockout结合Bootstrap创建动态UI实现产品列表管理
Sep 14 Javascript
js基于FileSaver.js 浏览器导出Excel文件的示例
Aug 15 Javascript
JavaScript判断日期时间差的实例代码
Mar 01 Javascript
详解vue2.0监听属性的使用心得及搭配计算属性的使用
Jul 18 Javascript
详解如何实现Element树形控件Tree在懒加载模式下的动态更新
Apr 25 Javascript
vue实现扫码功能
Jan 17 Javascript
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
PHP_MySQL教程-第一天
2007/03/18 PHP
PHP进程同步代码实例
2015/02/12 PHP
PHP 数据结构队列(SplQueue)和优先队列(SplPriorityQueue)简单使用实例
2015/05/12 PHP
PHP的全局错误处理详解
2016/04/25 PHP
浅谈Javascript嵌套函数及闭包
2010/11/09 Javascript
模仿百度三维地图的js数据分享
2011/05/12 Javascript
javascript parseInt() 函数的进制转换注意细节
2013/01/08 Javascript
Jquery实现视频播放页面的关灯开灯效果
2013/05/27 Javascript
详细分析使用AngularJS编程中提交表单的方式
2015/06/19 Javascript
详解JavaScript中常用的函数类型
2015/11/18 Javascript
教你用javascript实现随机标签云效果_附代码
2016/03/16 Javascript
AngularJS基础 ng-open 指令简单实例
2016/08/02 Javascript
vue-router2.0 组件之间传参及获取动态参数的方法
2017/11/10 Javascript
浅谈vuepress 踩坑记
2018/04/18 Javascript
微信小程序实现留言板
2018/10/31 Javascript
微信小程序实现笑脸评分功能
2018/11/03 Javascript
简单了解Ajax表单序列化的实现方法
2019/06/14 Javascript
VSCode写vue项目一键生成.vue模版,修改定义其他模板的方法
2020/04/17 Javascript
Vue父子之间值传递的实例教程
2020/07/02 Javascript
[02:08]2014DOTA2国际邀请赛 430专访:力争取得小组前二
2014/07/11 DOTA
对pandas中iloc,loc取数据差别及按条件取值的方法详解
2018/11/06 Python
详解Python time库的使用
2019/10/10 Python
使用tensorflow DataSet实现高效加载变长文本输入
2020/01/20 Python
TensorFLow 变量命名空间实例
2020/02/11 Python
Python浮点型(float)运算结果不正确的解决方案
2020/09/22 Python
css3中flex布局宽度不生效的解决
2020/12/09 HTML / CSS
深入剖析webstorage[html5的本地数据处理]
2016/07/11 HTML / CSS
娇韵诗法国官网:Clarins法国
2019/01/29 全球购物
应届大学生求职信
2013/12/01 职场文书
求职信的要素有哪些呢
2013/12/26 职场文书
珠宝店促销方案
2014/03/21 职场文书
幼儿教师师德承诺书
2014/05/23 职场文书
民族学专业职业生涯规划范文:积跬步以至千里
2014/09/11 职场文书
新年寄语2016
2015/08/17 职场文书
go 实现简易端口扫描的示例
2021/05/22 Golang
小程序实现文字循环滚动动画
2021/06/14 Javascript