基于jquery的一行代码轻松实现拖动效果


Posted in Javascript onDecember 28, 2010

实现拖动效果.

$(document).ready( function() 
{ 
$("#divPanel").easydrag(); 
} 
);

Html 代码

<div id="divPanel" style="width:300px;height:300px;background:white;border:1px solid #000000;position:absolute;left:5px;top:50px" > 
<div id="divTitle" style="width:100%;height:25px;background:lavender"> 
Title 
</div> 
<div style="width:100%"> 
</div> 
</div>

EasyDrag还可以指定可拖动的区域,比如只能通过标题拖动整个div,我们JS可以这样写

$(document).ready ( function() 
{ 
$("#divPanel").easydrag(); $("#divPanel").setHandler("divTitle"); 
} 
);

一个setHandler搞定,不错开源是个好东西,Jquery更是好东西,插件扩展机制不是一般的好。
Drag.rar打包
Javascript 相关文章推荐
Jquery ajax不能解析json对象,报Invalid JSON错误的原因和解决方法
Mar 27 Javascript
JavaScript编程的10个实用小技巧
Apr 18 Javascript
jQuery实现新消息在网页标题闪烁提示
Jun 23 Javascript
JavaScript实现上下浮动的窗口效果代码
Oct 12 Javascript
jQuery ajax全局函数处理session过期后的ajax跳转问题
Jun 03 Javascript
JavaScript学习小结之被嫌弃的eval函数和with语句实例详解
Aug 01 Javascript
原生js实现选项卡功能
Mar 08 Javascript
JavaScript实现各种排序的代码详解
Aug 28 Javascript
JavaScript笛卡尔积超简单实现算法示例
Jul 30 Javascript
微信小程序实现手势滑动卡片效果
Aug 26 Javascript
js实现带搜索功能的下拉框
Jan 11 Javascript
Js图片点击切换轮播实现代码
Jul 27 Javascript
JS date对象的减法处理实现代码
Dec 28 #Javascript
javascript中检测变量的类型的代码
Dec 28 #Javascript
javascript中的作用域scope介绍
Dec 28 #Javascript
原生Js实现按的数据源均分时间点幻灯片效果(已封装)
Dec 28 #Javascript
按给定几率进行随机抽取的js代码
Dec 28 #Javascript
围观tangram js库
Dec 28 #Javascript
让你的博文自动带上缩址的实现代码,方便发到微博客上
Dec 28 #Javascript
You might like
法兰绒滤网冲泡
2021/03/03 冲泡冲煮
PHP IPV6正则表达式验证代码
2010/02/16 PHP
PHP获取php,mysql,apche的版本信息示例代码
2014/01/16 PHP
PHP面向对象程序设计之对象生成方法详解
2016/12/02 PHP
jquery 新浪网易的评论块制作
2010/07/01 Javascript
JS Range HTML文档/文字内容选中、库及应用介绍
2011/05/12 Javascript
使用ajaxfileupload.js实现ajax上传文件php版
2014/06/26 Javascript
js添加select下默认的option的value和text的方法
2014/10/19 Javascript
学习JavaScript编程语言的8张思维导图分享
2015/03/27 Javascript
javascript实现汉字转拼音代码分享
2015/04/20 Javascript
原生js封装的ajax方法示例
2018/08/02 Javascript
深入理解JavaScript的值传递和引用传递
2018/10/24 Javascript
使用post方法实现json往返传输数据的方法
2019/03/30 Javascript
详解react组件通讯方式(多种)
2020/05/06 Javascript
element-ui tree结构实现增删改自定义功能代码
2020/08/31 Javascript
springboot+vue+对接支付宝接口+二维码扫描支付功能(沙箱环境)
2020/10/15 Javascript
python中对list去重的多种方法
2014/09/18 Python
Python使用pyh生成HTML文档的方法示例
2018/03/10 Python
python使用xlsxwriter实现有向无环图到Excel的转换
2018/12/12 Python
PyQt弹出式对话框的常用方法及标准按钮类型
2019/02/27 Python
python SQLAlchemy的Mapping与Declarative详解
2019/07/04 Python
Python基于OpenCV实现人脸检测并保存
2019/07/23 Python
python3中eval函数用法使用简介
2019/08/02 Python
Centos7 下安装最新的python3.8
2019/10/28 Python
基于CSS3实现的几个小loading效果
2018/09/27 HTML / CSS
HTML5之消息通知的使用(Web Notification)
2018/10/30 HTML / CSS
优衣库英国官网:UNIQLO英国
2016/12/25 全球购物
FC-Moto英国:欧洲最大的摩托车服装和头盔商店之一
2019/08/25 全球购物
北京振戎融通Java面试题
2015/09/03 面试题
2014年教师节寄语
2014/08/11 职场文书
企业优秀团员事迹材料
2014/08/20 职场文书
党员教师群众路线对照检查材料思想汇报
2014/09/29 职场文书
售后服务承诺函格式
2015/01/21 职场文书
2015年小学数学教师个人工作总结
2015/05/25 职场文书
学子宴致辞大全
2015/07/27 职场文书
CSS3实现的水平标题菜单
2021/04/14 HTML / CSS