;(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. Python 中的进程、线程、协程、同步、异步、回调

    进程和线程究竟是什么东西?传统网络服务模型是如何工作的?协程和线程的关系和区别有哪些?IO过程在什么时间发生? 一.上下文切换技术 简述 在进一步之前,让我们先回顾一下各种上下文切换技术. 不过首先说 ...

  2. ruby self.included用法

    ===Module#included 当一个模块混入到类时,如果该模块的included方法已经定义,那么该方法被调用.该方法的唯一参数就是接受混含的类的名字. module M def self.i ...

  3. 关于导出Excel

    Asp.Net 在刚毕业那会,做项目全是服务器控件.导出Excel的代码也很简单,在button触发后台事件后,后台生成一个excel文件,然后读取成字节,输出到客户端. Response.AddHe ...

  4. No Dialect mapping for JDBC type: -9

    由于项目中使用的是hibernate 4.35版本和sqlserver 2008数据库.所以,自定义方言时,需要和老版本做区别: public class MySQLServerDialect ext ...

  5. UML系列03之 UML类图(二)

    概要 在"UML系列02之 UML类图(一) "中介绍了类图的基本构成--类的UML表示方法.本文是接着前文,继续对"UML的类图"中几种关系进行介绍.介绍的主 ...

  6. [Tango] Basic Knowledge

    Project Tango类设备能够给开发者在哪些领域带来机会. 室内导航*:室内GPS信号的缺失,使得Project Tango设备会成为室内导航重要应用场景之一.有了它,你就不会在不熟悉的室内商场 ...

  7. multi-CPU, multi-core and hyper-thread--转

    原文地址:http://stackoverflow.com/questions/680684/multi-cpu-multi-core-and-hyper-thread Multi-CPU was t ...

  8. Hadoop入门进阶课程11--Sqoop介绍、安装与操作

    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,博主为石山园,博客地址为 http://www.cnblogs.com/shishanyuan  ...

  9. 『设计前沿』14款精致的国外 iOS7 图标设计示例

    每天都有大量的应用程序发布到 iOS App Store 上,在数量巨大的应用中想要引起用户的主要,首要的就是独特的图标设计.这篇文章收集了14款精致的国外 iOS7 图标设计示例,希望能带给你设计灵 ...

  10. How can I learn to program?

    黑客与画家:硅谷创业之父paul graham关于回答‘How can I learn to program’ How can I learn to program? Find a friend wh ...