jquery实现页面控件拖动效果js代码
;(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代码的更多相关文章
- SELECT控件操作的JS代码示例
SELECT控件操作的JS代码示例 1 检测是否有选中 if(objSelect.selectedIndex > -1) { //说明选中 } else { //说明没有选中 } 2.动态创建s ...
- 日历控件修改的JS代码
var bMoveable=true; var _VersionInfo=" " ; //============================================= ...
- 弹出框页面中使用jquery.validate验证控件
弹出框页面中使用jquery.validate验证控件有几个问题需要解决: 1,弹出框的提交事件完成后如何关闭弹出框页面? 2,提交不成功如何返回当前页? 3,如果知道验证事件成功? 之前笔者都是JS ...
- 基于Jquery WeUI的微信开发H5页面控件的经验总结(1)
在微信开发H5页面的时候,往往借助于WeUI或者Jquery WeUI等基础上进行界面效果的开发,由于本人喜欢在Asp.net的Web界面上使用JQuery,因此比较倾向于使用 jQuery WeUI ...
- 基于Jquery WeUI的微信开发H5页面控件的经验总结(2)
在微信开发H5页面的时候,往往借助于WeUI或者Jquery WeUI等基础上进行界面效果的开发,由于本人喜欢在Asp.net的Web界面上使用JQuery,因此比较倾向于使用 jQuery WeUI ...
- 使用Uploadify 时,同时使用了jQuery.Validition 验证控件时,在IE11上出现JS缺少对象错误。
场景: 使用jQuery.1.8.2 使用 Uploadify 3.2上传控件 使用jQuery.Validition 1.9 验证 使用IE 11 时,当鼠标点击上传按钮时,会出现JS 缺少对象错误 ...
- 利用来JS控制页面控件显示和隐藏有两种方法
利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位. 方法一: 1 2 document.getEle ...
- 基于jQuery 常用WEB控件收集
Horizontal accordion: jQuery 基于jQuery开发,非常简单的水平方向折叠控件. Horizontal accordion: jQuery jQuery-Horizonta ...
- 一些基于jQuery开发的控件
基于jQuery开发,非常简单的水平方向折叠控件.主页:http://letmehaveblog.blogspot.com/2007/10/haccordion-simple-horizontal-a ...
随机推荐
- Unity3D 中 Generic 动画导入设置和 Root Motion 之间的关系
2条评论 Unity3D 的 Mecanim 动画系统可以直接复用 3DS MAX 中制作的动画文件中的位移,这个就是通过 applyRootMotion 来达成的,我们只需要在使用 Animator ...
- UML2
UML中有3种构造块:事物.关系和图,事物是对模型中最具有代表性的成分的抽象:关系是把事物结合在一起:图聚集了相关的的事物.具体关系图标如下 说明:构件事物是名词,是模型的静态部分.行为事物是动态部分 ...
- Shooting Algorithm
Shooting算法是Wenjiang提出的一种优化Lasso(L1 Regularization)和Bridge Regression的算法, 本文以Lasso为例. 对于线性回归问题$\mathb ...
- How to change statusbar text color to dark on android 4.4
Because I haven't enough votes, so post picture at here, thank you. Almost 2 weeks ago, I was search ...
- zepto - push
var arr = ['1', '2', '3', '4']; arr.push('qwe'); console.log(arr);
- 在 Ubuntu 配置 PPTP Server
本文在 Ubuntu 12.4 或 14 亲测有效. 建立 PPTP 服务器 首先安装 pptp 服务器. # apt-get install pptpd 然后配置 pptpd. # sudo vi ...
- HTML注释引起的问题
因为规范要求需要对页面进行说明,添加作者等信息,所以在cshtml的代码中添加了html注释,包括之前使用jsp也是这样做的: 在页面布局的时候,需要对高度进行动态计算,IE8以上没有问题,主要是在I ...
- JS思维之路菜鸟也能有大能量-序幕
准备写一类关于Js的开发思想的文章,这系列文章需要有一定的js基础,在这里不会去说太多的js基础知识,因为这系列文章不是写基础东西,而是一种编程思想,如果你还是js新手,那么建议你有一定基础后再看. ...
- Hibernate基础映射
在说Hibernate映射前,我们先来了解下对象关系映射 ORM.ORM的实现思想就是将关系数据库中表的数据映射成对象,以对象的形式展现.这样开发人员就可以把对数据库的操作转化为对这些对象的操作.我们 ...
- Google Kubernetes设计文档之服务篇-转
摘要:Kubernetes是Google开源的容器集群管理系统,构建于Docker之上,为容器化的应用提供资源调度.部署运行.服务发现.扩容缩容等功能. Pod是创建.调度和管理的最小部署单位,本文详 ...