代码短小的js div层拖动实现代码[兼容IE与Firefox]

更新时间：2010年05月11日 18:45:24 作者：

代码短小的js div层拖动实现代码[兼容IE与Firefox],需要的朋友可以参考下.

<script type="text/javascript"> var ie=document.all; var nn6=document.getElementById&&!document.all; var isdrag=false; var x,y; var dobj; function movemouse(e) { if (isdrag) { dobj.style.left = nn6 ? tx + e.clientX - x : tx + event.clientX - x; dobj.style.top = nn6 ? ty + e.clientY - y : ty + event.clientY - y; return false; } } function selectmouse(e) { var fobj = nn6 ? e.target : event.srcElement; var topelement = nn6 ? "HTML" : "BODY"; while (fobj.tagName != topelement && fobj.className != "dragme") { fobj = nn6 ? fobj.parentNode : fobj.parentElement; } if (fobj.className=="dragme") { isdrag = true; dobj = fobj; tx = parseInt(dobj.style.left+0); ty = parseInt(dobj.style.top+0); x = nn6 ? e.clientX : event.clientX; y = nn6 ? e.clientY : event.clientY; document.onmousemove=movemouse; return false; } } document.onmousedown=selectmouse; document.onmouseup=new Function("isdrag=false"); </script> <div align="center"> <img src="https://www.jb51.net/images/logo.gif" style="position:relative;" width="210" height="96" class="dragme"> </div>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

相关文章

全面接触神奇的Bootstrap导航条实战篇
导航条（navbar）在Bootstrap中是一个独立组件，导航条（navbar）和导航（nav）在Bootstrap中是有明显区别的，本文全面接触神奇的Bootstrap导航条，感兴趣的小伙伴们可以参考一下
2016-08-08
javascript动态添加样式(行内式/嵌入式/外链式等规则)
添加CSS的方式有行内式、嵌入式、外链式、导入式，下面为大家详细介绍下javascript动态添加以上样式规则的方法，感兴趣的朋友可以参考下哈
2013-06-06
如何使用JavaScript检测空闲的浏览器选项卡
这篇文章主要介绍了如何使用JavaScript检测空闲的浏览器选项卡，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
2020-05-05
理解JavaScript中的适配器模式Adapter Pattern
这篇文章主要介绍了理解JavaScript中的适配器模式,适配器模式即Adapter Pattern，是作为两个不兼容的接口之间的桥梁。这种类型的设计模式属于结构型模式，下文更多相关介绍需要的小伙伴可以参考一下
2022-04-04
JavaScript 变量、作用域及内存
这篇文章主要介绍了JavaScript 变量、作用域及内存,需要的朋友可以参考下
2015-04-04
js实现日历
这篇文章主要介绍了js如何实现日历，帮助大家完成需求，提高对js的理解，感兴趣的朋友可以了解下
2020-11-11
js实现无缝滚动特效
这篇文章主要介绍了js实现无缝滚动特效，结合已学知识进行扩展性练习，感兴趣的朋友可以参考一下
2015-12-12
JS+php后台实现文件上传功能详解
这篇文章主要介绍了JS+php后台实现文件上传功能,结合实例形式分析了javascript前台表单数据提交与后台php文件传输处理相关操作技巧,需要的朋友可以参考下
2019-03-03
js实现页面多个日期时间倒计时效果
这篇文章主要为大家详细介绍了js实现页面多个日期时间倒计时效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2019-06-06
JavaScript简单拖拽效果（1）
这篇文章主要为大家详细介绍了JavaScript简单拖拽效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-05-05

最新评论