;(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. 重构第2天:方法搬移(Move Method)

    现在就重构来说是非常普通的,虽然我们经常会漏掉或忽略一些需要重构的地方.方法搬移,正如所定义的那样,把方法搬移到更适合他的位置.让我们看看下面这一段重构前的代码: 理解:方法搬移,正如所定义的那样,把 ...

  2. 在使用sqlite时淌过的坑

    以前一直用sqlite.net 1.0.66.0版本,在.net4下面程序写好了部署到目的地机器时winform程序总是出现缺少运行时的问题.有时装了运行时也还是出问题,后来发现是混合模式的问题,当时 ...

  3. Codeforces Round #237 (Div. 2) C. Restore Graph(水构造)

    题目大意 一个含有 n 个顶点的无向图,顶点编号为 1~n.给出一个距离数组:d[i] 表示顶点 i 距离图中某个定点的最短距离.这个图有个限制:每个点的度不能超过 k 现在,请构造一个这样的无向图, ...

  4. log4net使用的关键点

    <configSections>     < section name =" log4net" type="log4net.Config.Log4Net ...

  5. AssetBundle系列——打包前进行平台检测

    在生成AssetBundle的时候,如果目标平台和当前平台不一致,Unity3D会自动将当前平台转换为目标平台. 如果项目中资源量比较大,这个转换过程是相当漫长的,并且不能够强行中止. 所以最好在Bu ...

  6. 编写高质量JS代码的68个有效方法(七)

    [20141220]编写高质量JS代码的68个有效方法(七) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...

  7. 【转载】Grunt常用插件介绍

    项目名称 grunt-contrib v0.8.0 项目地址 https://github.com/gruntjs/grunt-contrib 项目介绍 此项目是对grunt常用插件的集合,刚接触gr ...

  8. 【转载】Linux动态库搜索路径的技巧

    转自:http://soft.chinabyte.com/os/232/11488732_2.shtml 众所周知,Linux动 态库的默认搜索路径是/lib和/usr/lib.动态库被创建后,一般都 ...

  9. LeetCode-95. Unique Binary Search Trees II

    Description: Given n, generate all structurally unique BST's (binary search trees) that store values ...

  10. NodeJS+Mongodb+Express做CMS博客系统

    楼主正在用业余时间开发中-- ,目前的版本仅支持会员系统,尝鲜一下吧~ hi-blog 一个 nodejs+express+mongodb 的 cms 系统 怎么启动 默认你已经安装了 mongodb ...