当前位置: 编程技术>jquery
jQuery EasyDrag实现DIV拖动
来源: 互联网 发布时间：2014-09-03
本文导语: 最近在做浮动层的拖动时，意外发现了一个jquery的拖动插件EasyDrag，只需简短的一两行代码即可在主流浏览器上面轻松拖动。 1、将id为div1的div实现拖动 代码如下: $(document).ready( function(){ $("#div1").easydrag(); } ); 2、EasyD...
最近在做浮动层的拖动时，意外发现了一个jquery的拖动插件EasyDrag，只需简短的一两行代码即可在主流浏览器上面轻松拖动。
1、将id为div1的div实现拖动
代码如下:
$(document).ready(
function(){
$("#div1").easydrag();
}
);
function(){
$("#div1").easydrag();
}
);
2、EasyDrag 指定可拖动的区域
代码如下:
比如只能通过标题拖动整个div
$(document).ready(
function(){
$("#div2").easydrag();
$("#div2").setHandler('div3');
}
);
$(document).ready(
function(){
$("#div2").easydrag();
$("#div2").setHandler('div3');
}
);
3、一些API：
代码如下:
拖动完成后执行某些操作：$("#div1").ondrop(function(e, element){ alert(element.innerHTML); });
禁止拖动：$("#div2").dragOff();
开启拖动$("#div2").dragOn();
禁止拖动：$("#div2").dragOff();
开启拖动$("#div2").dragOn();
官网链接：http://fromvega.com/wordpress/2007/07/14/easydrag-jquery-plugin/
点这里查看演示。
点这里下载示例代码。
您可能感兴趣的文章:
本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术，将尽最大努力为读者提供更好的信息聚合和浏览方式。
本站(WWW.)站内文章除注明原创外，均为转载、整理或搜集自网络。欢迎任何形式的转载，转载请注明出处。
本站(WWW.)站内文章除注明原创外，均为转载、整理或搜集自网络。欢迎任何形式的转载，转载请注明出处。