;(function($) {
var DragPanelId = "divContext";
var _idiffx = 0;
var _idiffy = 0;
var _Div = null;
$.extend({

AttachDrag: function(dragId) {
if (dragId)
$._Div = document.getElementById(dragId);
else
$._Div = document.getElementById($.DragPanelId);
document.body.onmousedown = $._handleMouseDown;

},
_handleMouseDown: function() {
var oEvent = window.event;
if ($._Div) {
$._idiffx = oEvent.clientX - $._Div.offsetLeft;
$._idiffy = oEvent.clientY - $._Div.offsetTop;
document.body.onmousemove = $._handleMouseMove;
document.body.onmouseup = $._handleMouseUp;
}
},
_handleMouseMove: function() {
var oEvent = window.event;
$._Div.style.left = oEvent.clientX - $._idiffx;
$._Div.style.top = oEvent.clientY - $._idiffy;
$._Div.style.cursor = "move";
},
_handleMouseUp: function() {
document.body.onmousemove = null;
document.body.onmouseup = null;
$._Div.style.cursor = "default";
}
});
}
)(jQuery)

jquery实现页面控件拖动效果js代码的更多相关文章

  1. SELECT控件操作的JS代码示例

    SELECT控件操作的JS代码示例 1 检测是否有选中 if(objSelect.selectedIndex > -1) { //说明选中 } else { //说明没有选中 } 2.动态创建s ...

  2. 日历控件修改的JS代码

    var bMoveable=true; var _VersionInfo=" " ; //============================================= ...

  3. 弹出框页面中使用jquery.validate验证控件

    弹出框页面中使用jquery.validate验证控件有几个问题需要解决: 1,弹出框的提交事件完成后如何关闭弹出框页面? 2,提交不成功如何返回当前页? 3,如果知道验证事件成功? 之前笔者都是JS ...

  4. 基于Jquery WeUI的微信开发H5页面控件的经验总结(1)

    在微信开发H5页面的时候,往往借助于WeUI或者Jquery WeUI等基础上进行界面效果的开发,由于本人喜欢在Asp.net的Web界面上使用JQuery,因此比较倾向于使用 jQuery WeUI ...

  5. 基于Jquery WeUI的微信开发H5页面控件的经验总结(2)

    在微信开发H5页面的时候,往往借助于WeUI或者Jquery WeUI等基础上进行界面效果的开发,由于本人喜欢在Asp.net的Web界面上使用JQuery,因此比较倾向于使用 jQuery WeUI ...

  6. 使用Uploadify 时,同时使用了jQuery.Validition 验证控件时,在IE11上出现JS缺少对象错误。

    场景: 使用jQuery.1.8.2 使用 Uploadify 3.2上传控件 使用jQuery.Validition 1.9 验证 使用IE 11 时,当鼠标点击上传按钮时,会出现JS 缺少对象错误 ...

  7. 利用来JS控制页面控件显示和隐藏有两种方法

    利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位. 方法一:  1 2 document.getEle ...

  8. 基于jQuery 常用WEB控件收集

    Horizontal accordion: jQuery 基于jQuery开发,非常简单的水平方向折叠控件. Horizontal accordion: jQuery jQuery-Horizonta ...

  9. 一些基于jQuery开发的控件

    基于jQuery开发,非常简单的水平方向折叠控件.主页:http://letmehaveblog.blogspot.com/2007/10/haccordion-simple-horizontal-a ...

随机推荐

  1. cwRsync window下的跨服务器的文件同步

    cwRsync 是window下的文件同步软件,可以跨服务器运行,第一次运行的时候是全部备份同步,之后的同步采用的是增量同步 这个软件分为服务端和客户端. 服务器是需要同步的文件源, 客户端相当于是备 ...

  2. S5PV210之Sate210-F DIY硬件,移植uboot,kernel,android 活动现在已经进入实施阶段吗,欢迎广大网友参与 !

    大家一起来diy 超低价四核的exynos4412或者Cortex A8S5pv210开源开发板 商业版Sate210已经完成了好久了.Sate4412 也已经出来.但是这两个接口非常全,主要是针对企 ...

  3. MyEclipse 2015优化技巧

    MyEclipse 2015优化速度方案仍然主要有这么几个方面:去除无需加载的模块.取消冗余的配置.去除不必要的检查.关闭更新. 第一步: 去除不需要加载的模块 一个系统20%的功能往往能够满足80% ...

  4. SQL server 数据库连接方式分析

    SQL server 数据库连接方式图示: ODBC和OLEDB连接的区别 ODBC(开放数据库互连):是Microsoft引进的一种早期数据库接口技术.它实际上是ADO的前身.早期的数据库连接是非常 ...

  5. ORA-12170:TNS:连接超时

    本文转自 http://www.cnblogs.com/kerrycode/archive/2012/12/14/2818421.html 1:首先检查网络是否能ping通 2:检查TNS配置(TNS ...

  6. 爬虫技术 -- 进阶学习(八)模拟简单浏览器(附c#代码)

    由于最近在做毕业设计,需要用到一些简单的浏览器功能,于是学习了一下,顺便写篇博客~~大牛请勿喷,菜鸟练练手~ 实现界面如下:(简单朴素版@_@||) button_go实现如下: private vo ...

  7. iOS-Debug调试

    转载:http://www.cnblogs.com/Leo_wl/p/4423922.html

  8. Android 学习笔记之AndBase框架学习(三) 使用封装好的函数完成Http请求..

    PS:踏踏实实走好每一步... 学习内容: 1.使用AndBase框架实现无参Http Get请求... 2.使用AndBase框架实现有参Http Post请求... 3.使用AndBase框架实现 ...

  9. Android学习笔记之dispatchTouchEvent和OnInterceptTouchEvent和OnTouchEvent三个方法之间的联系...

    PS:好久没有写博客了,项目正式开始启动了,但是怎么也打不起精神来...可能还是不适应放假留校...这下一年只能回家一次了...伤感...写篇博客舒坦下... 学习内容:   Android中disp ...

  10. Sprint回顾-0525

    1.回顾组织 主题:“我们下次怎么样才能更加认真对待?” 时间:设定为1小时. 参与者:整个团队. 场所:宿舍走廊. 秘书:团队队长秘书,筹备.记录.整理.   2.回顾流程    Sprint总结: ...