jq实现拖拽
$("body").delegate(
".msg-layer",{
mousedown: function (e) {
var el = $(".msg-layer");
var os = el.offset(),
dx = e.pageX - os.left, dy = e.pageY - os.top;
$(document).on('mousemove.drag', function (e) {
el.offset({top: e.pageY - dy, left: e.pageX - dx});
});
},
mouseup: function (e) {
$(document).off('mousemove.drag');
}
}
);
".msg-layer"为被拖拽的元素
jq实现拖拽的更多相关文章
- 基于 jq 实现拖拽上传 APK 文件,js解析 APK 信息
技术栈 jquery 文件上传:jquery.fileupload,github 文档 apk 文件解析:app-info-parser,github 文档 参考:前端解析ipa.apk安装包信息 - ...
- jq元素拖拽
<div id="a1"></div> js <script type="text/javascript"> $(funct ...
- jQ插件--时间线插件和拖拽API
这个时间轴是工作上用到的,自己写了一个, qq空间有时间轴的控件, 百度文库也有时间轴的控件: 百度的时间轴大概是这样的: 用户点击对应的锚链接, 那个三角会滚动, 然后左侧的界面也会滚动: 实际的 ...
- 27、 jq 拖拽
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JQ实现3D拖拽效果
<!DOCTYPE HTML> <html onselectstart='return false'> <head> <meta http-equiv=&qu ...
- Jquery 多行拖拽图片排序 jq优化
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 不断优化,重构我的代码-----拖拽jquery插件
最近学东西学的有点太散了,歇一阵子,重新完善之前的JQ插件,今天先上拖拽吧 // JavaScript Document (function($){ var defaults = { actionEl ...
- html5拖拽实现
1.需求 做一个h5正方形的拖拽框 2.分析 使用touchstart,touchmove,touchend这3个事件实现. 需要记录的数据有三组数据,分别是下图的(x0,y0),(x1,y1),(x ...
- JQUERY 拖拽 draggable droppable resizable selectable sortable
今天用了jq ui的拖动碰撞功能,好不容易看到有详细的API解说,记录如下: <script language="JavaScript" type="text/ ...
随机推荐
- 对.net事件的看法
对.net事件的看法 一.事件的本质 事件是软件系统里的两个子系统之间,或者两个模块之间,或者两个对象之间发送消息,并处理消息的过程.在面向对象的世界里,就可以统一认为是两个对象之间的行为. 两个对象 ...
- Solr后台管理
Solr web管理后台 访问主页:http://localhost:8080/solr/#/ 1. Dashboard 仪表盘,显示Solr的基本信息,包含solr版本,包含系统内存和jvm内存的使 ...
- 百度搜索URL参数含义
序号 参数 含义 1 tn 搜索框所属网站.比如 tn=sitehao123,就是 http://www.hao123.com/ 左上那个搜索框(指通过什么方式到达百度首页搜索界面;) 2 s?wd ...
- Vue 多路由文件的合并
Vue 多路由文件的合并 1.使用的是ES6 数组的合并方法 let routes = new Set([...routes1, ...homerouters]);2.两个路由文件,导出的实际上就是一 ...
- 961 -尺寸2N阵列中的N重复元素
在一个A大小的数组中2N,有N+1独特的元素,这些元素中的一个重复N次. 返回重复N次的元素. 例1: 输入:[1,2,3,3] 输出:3 例2: 输入:[2,1,2,5,3,2] 输出:2 例3: ...
- java EE 新手入门了解
郑重申明:本文转载至https://blog.csdn.net/Neuf_Soleil/article/details/80962686,在此深表感谢! 为什么选择java? 想必有很多初学者会像我一 ...
- Java注解拾遗
注解简介: 注解Annotation是jdk1.5的新增功能,在现在的日常开发中,几乎离不开注解,写篇短文,来做个拾遗. 注解作用: Annotation(注解)的作用是修饰包.类.构造方法.方法.成 ...
- COCI2017-2018-2 San
题意 有\(n \leq 40\)个节点,每个节点有权值\(H \leq 1e9\)和贡献\(v \leq 1e9\),从任意一个点可以向右跳到一个权值不小于它的节点,并获得该点贡献 可以从任意一个点 ...
- BZOJ1149 [CTSC2007]风玲
Description Input Output 输出仅包含一个整数.表示最少需要多少次交换能使风铃满足Ike的条件.如果不可能满足,输出-1. Sample Input 6 2 3 -1 4 5 6 ...
- 关于npm构建angular2项目问题
我在win10系统下用npm构建好angular2项目之后,在命令行下运行 ng serve --open,报一下错误: Unknown browser query 'basedir=$(dirnam ...