基于jquery的鼠标拖动效果代码


Posted in Javascript onMay 30, 2012

记得在之前的一个"拖动层"的随笔中,我实现拖动,是用的一个布尔变量,判断是否可以拖动某元素。
这两天看了一些东西,发现不需要设这个布尔变量;

实现过程:
按下鼠标的时候,给文档对象(当然也可以是别的DOM对象)的移动事件绑定一个处理函数,同时也给鼠标抬起时绑定一个解除的处理函数。

//按下鼠标并移动时(拖动),调用的函数; 
function startSelection(event){ 
…… 
} //解除移动时的处理函数; 
function cancelSelection() { 
$(document).unbind('mousemove', startSelection).unbind('mouseup', cancelSelection); 

} 
//鼠标在按下时调用的函数 
function imgMouseDown(event){ 
$(document).mousemove(startSelection).mouseup(cancelSelection); 
} 
$img.bind("mousedown",imgMouseDown)
Javascript 相关文章推荐
超级酷和最实用的jQuery实例收集(20个)
Apr 21 Javascript
JavaScript NodeTree导航栏(菜单项JSON类型/自制)
Feb 01 Javascript
jquery无刷新验证邮箱地址实现实例
Feb 19 Javascript
原生javascript模仿win8等待提示圆圈进度条
Apr 24 Javascript
jQuery鼠标事件汇总
Aug 30 Javascript
JS中对Cookie的操作详解
Aug 05 Javascript
jQuery中animate的几种用法与注意事项
Dec 12 Javascript
js时间控件只显示年月
Jan 08 Javascript
vue自定义键盘信息、监听数据变化的方法示例【基于vm.$watch】
Mar 16 Javascript
小程序中英文混合排序问题解决
Aug 02 Javascript
JS中的算法与数据结构之常见排序(Sort)算法详解
Aug 16 Javascript
vue实现div可拖动位置也可改变盒子大小的原理
Sep 16 Javascript
基于jquery的文本框与autocomplete结合使用(asp.net+json)
May 30 #Javascript
基于jQuery的倒计时实现代码
May 30 #Javascript
基于jquery的放大镜效果
May 30 #Javascript
幻灯片带网页设计中的20个奇妙应用示例小结
May 27 #Javascript
Javascript的常规数组和关联数组对比小结
May 24 #Javascript
基于mootools插件实现遮罩层新手引导
May 24 #Javascript
jQuery 拖动层(在可视区域范围内)
May 24 #Javascript
You might like
不用mod_rewrite直接用php实现伪静态化页面代码
2008/10/04 PHP
php中http与https跨域共享session的解决方法
2014/12/20 PHP
PHP实现接收二进制流转换成图片的方法
2017/01/10 PHP
类似php的js数组的in_array函数自定义方法
2013/12/27 Javascript
利用js制作html table分页示例(js实现分页)
2014/04/25 Javascript
express的中间件bodyParser详解
2014/12/04 Javascript
使用jquery操作session方法分享
2015/01/22 Javascript
javascript验证邮件地址和MX记录的方法
2015/06/16 Javascript
javascript实现添加附件功能的方法
2015/11/18 Javascript
基于jQuery实现交互体验社会化分享代码附源码下载
2016/01/04 Javascript
HTML5canvas 绘制一个圆环形的进度表示实例
2016/12/16 Javascript
Bootstrap源码解读媒体对象、列表组和面板(10)
2016/12/26 Javascript
node操作mysql数据库实例详解
2017/03/17 Javascript
angular2中router路由跳转navigate的使用与刷新页面问题详解
2017/05/07 Javascript
原生js实现密码输入框值的显示隐藏
2017/07/17 Javascript
Nuxt.js 静态资源和打包的操作
2020/11/06 Javascript
[08:44]和酒神一起战斗 DOTA2教你做大人
2014/03/27 DOTA
python实现字符串和日期相互转换的方法
2015/05/13 Python
Python实现将DOC文档转换为PDF的方法
2015/07/25 Python
Python文件操作基本流程代码实例
2017/12/11 Python
python实现发送邮件功能代码
2017/12/14 Python
python读取文本中数据并转化为DataFrame的实例
2018/04/10 Python
python数据化运营的重要意义
2019/11/25 Python
Python模块的制作方法实例分析
2019/12/21 Python
Python批量安装卸载1000个apk的方法
2020/04/10 Python
Python+OpenCV图像处理——实现直线检测
2020/10/23 Python
iframe在移动端的缩放的示例代码
2018/10/12 HTML / CSS
优衣库美国官网:UNIQLO美国
2018/04/14 全球购物
The Body Shop美体小铺西班牙官网:天然化妆品
2019/06/21 全球购物
大学生党课思想汇报
2013/12/29 职场文书
丑小鸭教学反思
2014/02/03 职场文书
人民调解员先进事迹材料
2014/05/08 职场文书
中学生自我评价范文
2015/03/03 职场文书
外出学习心得体会范文
2016/01/18 职场文书
传单、海报早OUT了,另类传单营销方案送给你!
2019/07/15 职场文书
Python可视化动图组件ipyvizzu绘制惊艳的可视化动图
2022/04/21 Python