jquery 模块拖拽
这是模块拖拽Javascript代码
$(function(){
var _move=false;//移动标记
var _x,_y;//鼠标离控件左上角的相对位置
$(".drag").click(function(){
//alert("click");//点击(松开后触发)
}).mousedown(function(e){
_move=true;
_x=e.pageX-parseInt($(".drag").css("left"));
_y=e.pageY-parseInt($(".drag").css("top"));
$(".drag").fadeTo(20, 0.5);//点击后开始拖动并透明显示
});
$(document).mousemove(function(e){
if(_move){
var x=e.pageX-_x;//移动时根据鼠标位置计算控件左上角的绝对位置
var y=e.pageY-_y;
$(".drag").css({top:y,left:x});//控件新位置
}
}).mouseup(function(){
_move=false;
$(".drag").fadeTo("fast", 1);//松开鼠标后停止移动并恢复成不透明
});
});
演示demo:http://www.daqianduan.com/demo/drag.html
jquery 模块拖拽的更多相关文章
- jQuery可拖拽3D万花筒旋转特效
这是一个使用了CSS3立体效果的强大特效,本特效使用jQuery跟CSS3 transform来实现在用户鼠标按下拖动时,环形图片墙可以跟随鼠标进行3D旋转动画. 效果体验:http://hovert ...
- jQuery可拖拽排序列表jquery-sortable-lists
jquery-sortable-lists可以通过鼠标进行拖动排列树型菜单,可以定义某个列表元素是否拖动,拖动后回调,点击可以折叠树型结点,可以用来在后台模仿wordpress后台拖动菜单,实现多级菜 ...
- jQuery 鼠标拖拽移动窗口
拖拽移动需要注意的是:拖拽移动的窗口是如何定位的,如果"left"属性为"%" ,以"margin-left"来计算定位,如下实例,如果&q ...
- JS实现多Div模块拖拽功能
空闲时间,同事让帮忙整个JS拖拽div模块功能.于是便在网上搜索,总结如下一个可实现多div模块拖拽的功能.一下是整体的HTML代码, 里边可以控制到 拖拽开始(onStart),拖拽时候(onMov ...
- jquery实现拖拽以及jquery监听事件的写法
很久之前写了一个jquery3D楼盘在线选择,这么一个插件,插件很简单,因为后期项目中没有实际用到,因此,有些地方不是很完善,后面也懒得再进行修改维护了.最近放到github上面,但是也少有人问津及s ...
- jquery sortTable拖拽排序
所有的事件回调函数都有两个参数:event和ui,浏览器自有event对象,和经过封装的ui对象 ui.helper - 表示sortable元素的JQuery对象,通常是当前元素的克隆对象 ...
- jQuery 鼠标拖拽排序
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...
- SpringMvc+jQuery 文件拖拽上传、选择上传
最近做了个简易的基于boostrap的文件上传功能,jsp版本的,后续会完善更多的功能,不过现在已经能用了,需要的小伙伴,直接引用下面的文件内容直接copy到自己的项目中就ok了,效果如图: file ...
- 面向对象+jquery实现拖拽功能
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
随机推荐
- 【转】spring3 MVC实战,手工搭建Spring3项目demo
更新:这几天对spring3的理解又进了一步,今天抽空把这篇文章中的错误和不当之处做了修改. 最近的项目在用Spring3,涉及到了基于注解的MVC,事务管理,与hibernate的整合开发等内容,我 ...
- Linux(CentOS)常用命令
http://fedoranews.org/alex/tutorial/rpm/3.shtml rpm.org rpm -qa|grep mysql 查询已安装的含有mysql的包. mv 移动文件. ...
- Twisted 阐述
原地址:http://bbs.gameres.com/thread_224020.html Firefly为什么使用Twisted?1.基于PythonTwisted是使用Python编写的,强壮的. ...
- C#虚方法virtual详解
转: http://www.cnblogs.com/jason_yjau/archive/2009/08/25/1553949.html C#虚方法virtual详解 在C++.Java等众多OOP语 ...
- CodeChef A
问题是求出斐波那契数列的第n个,这里要用大数加法预处理,然后就可以了 代码: #include <iostream> #include <sstream> #include & ...
- JMP软件中的晶圆图( Wafer Map)分析
关键词:芯片 良率分析 晶圆图 质量管理 JMP Minitab 半导体芯片的生产,简单来讲,是将电路通过各种复杂的物理化学方法制作到晶圆上,在生产的最后阶段会进行不同电性功能的测试以确保产品的功能性 ...
- 程序不稳定是因为C++基础不扎实
最近开发的程序,逻辑上都实现了,但是感觉运行不稳定,程序时不时崩溃(不是逻辑运行不正确),至少找出2个错误: 情况1:char* szRemoteReal = new char[MAX_LENGTH] ...
- 雷军的B面:那些赔到血本无归的失败投资案例
文/李红双 雷军投资方向偏多元化布局,从电商到房地产,从互联网社区到移动互联网,多方跨界的结果必然是有失有得.本文扒一扒“雷军系”中最惨烈的电商投资,凡客诚品融资5.3亿美元目前处于垮台边缘,乐淘融资 ...
- int指令理解
以下是王爽老师的<汇编语言>中第十五章中的一段程序代码,其功能是增加9号中断的功能,当按下Esc键时屏幕中显示的字母改变颜色 assume cs:codesg,ss:stack,ds:da ...
- POI导出数据内存溢出问题
POI之前的版本不支持大数据量处理,如果数据过多则经常报OOM错误,有时候调整JVM大小效果也不是太好.3.8版本的POI新出来了SXSSFWorkbook,可以支持大数据量的操作,只是SXSSFWo ...