JavaScript兼容IE,firefox的拖拽功能
来源： 阅读：630 次 日期：2015-04-17 10:38:39
温馨提示： 小编为您整理了“JavaScript兼容IE,firefox的拖拽功能”,方便广大网友查阅！
JavaScript兼容IE,firefox的拖拽功能：
代码实例：拖动对象 Drag Object (兼容:IE、Firefox、Opera ... )title></p>
<p><meta http-equiv="content-type" content="text/html; charset=utf8" /></p>
<p><meta name="keywords" content="代码实例：拖动对象"></p>
<p><meta name="description" content="最简短的拖动对象代码实例演示"></p>
<p><style></p>
<p>.dragAble {position:relative;cursor:move;}</p>
<p>style></p>
<p><script language="javascript"></p>
<p>var ie=document.all;</p>
<p>var nn6=document.getElementById&&!document.all;</p>
<p>var isdrag=false;</p>
<p>var y,x;</p>
<p>var oDragObj;</p>
<p>function moveMouse(e) {</p>
<p>if (isdrag) {</p>
<p>oDragObj.style.top = (nn6 ? nTY + e.clientY - y : nTY + event.clientY - y)+"px";</p>
<p>oDragObj.style.left = (nn6 ? nTX + e.clientX - x : nTX + event.clientX - x)+"px";</p>
<p>return false;</p>
<p>}</p>
<p>}</p>
<p>function initDrag(e) {</p>
<p>var oDragHandle = nn6 ? e.target : event.srcElement;</p>
<p>var topElement = "HTML";</p>
<p>while (oDragHandle.tagName != topElement && oDragHandle.className != "dragAble") {</p>
<p>oDragHandle = nn6 ? oDragHandle.parentNode : oDragHandle.parentElement;</p>
<p>}</p>
<p>if (oDragHandle.className=="dragAble") {</p>
<p>isdrag = true;</p>
<p>oDragObj = oDragHandle;</p>
<p>nTY = parseInt(oDragObj.style.top+0);</p>
<p>y = nn6 ? e.clientY : event.clientY;</p>
<p>nTX = parseInt(oDragObj.style.left+0);</p>
<p>x = nn6 ? e.clientX : event.clientX;</p>
<p>document.onmousemove=moveMouse;</p>
<p>return false;</p>
<p>}</p>
<p>}</p>
<p>document.onmousedown=initDrag;</p>
<p>document.onmouseup=new Function("isdrag=false");</p>
<p>//--></p>
<p>script></p>
<p>head></p>
<p><body></p>
<p><img src="" class="dragAble" / onclick="javascript:window.open(this.src);" style="cursor: pointer" alt="点此在新窗口浏览图片" onmousewheel="return bbimg(this)" onload="javascript:resizepic(this)"></p>
<p><img src="" class="dragAble" / onclick="javascript:window.open(this.src);" style="cursor: pointer" alt="点此在新窗口浏览图片" onmousewheel="return bbimg(this)" onload="javascript:resizepic(this)"></p>
<p><img src="" class="dragAble" / onclick="javascript:window.open(this.src);" style="cursor: pointer" alt="点此在新窗口浏览图片" onmousewheel="return bbimg(this)" onload="javascript:resizepic(this)"><br /><br /></p>
<p><div style="border:1px solid #ff6d00;background:#ffd801;width:240px;padding:5px 0;" class="dragAble">这些都是可拖动对象div></p>
<p><body></p>
<p><html></p>
<p>更多信息请查看<a href="//www.reelogic.com/c2021.aspx" target="_blank">IT技术专栏</a></p>
</div>
<div class="c_nrgg"></div>
<div class="c_nrgdd">
更多信息请查看
<a href="//www.reelogic.com/c2025.aspx">脚本栏目</a>
</div>
<div class="c_nrgdd"></div>
<div class="c_nrgdd">
<a href="//www.reelogic.com/memberNewsAdd.aspx">【点此处就本文及相关问题在本站进行非正式的简要咨询（便捷快速）】</a>
<a href="//www.reelogic.com/n4836c56.aspx">【点此处查询各地各类考试咨询QQ号码及交流群】</a>
</div>
<div class="c_nrgdds">
上一篇：
<a href="//www.reelogic.com/n1017094c2025.aspx">JavaScript实现增删改查功能</a>
</div>
<div class="c_nrgdds">
下一篇：
<a href="//www.reelogic.com/n1017117c2025.aspx">javascript实现动态定制定时器</a>
</div>
<div class="c_nrgdds">
手机网站地址：
<a href="//www.reelogic.com/wap/n1017098c2025.aspx">JavaScript兼容IE,firefox的拖拽功能</a>
</div>
<div class="c_nrgdd">
由于各方面情况的不断调整与变化， 提供的所有考试信息和咨询回复仅供参考，敬请考生以权威部门公布的正式信息和咨询为准！
</div>
<div class="c_nrtja">
<div class="c_nrtja1">
<span class="c_nrtja2">相关阅读</span>
<a href="//www.reelogic.com/c2025.aspx">脚本栏目</a>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1970373c2025.aspx">Bottle框架中的装饰器类和描述符应用详解</a></span>
<span class="c_nrtja5" style="color:gray;">10月30日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1970372c2025.aspx">Python探索之SocketServer详解</a></span>
<span class="c_nrtja5" style="color:gray;">10月30日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1970368c2025.aspx">Python探索之实现一个简单的HTTP服务器</a></span>
<span class="c_nrtja5" style="color:gray;">10月30日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1970364c2025.aspx">python探索之BaseHTTPServer-实现Web服务器介绍</a></span>
<span class="c_nrtja5" style="color:gray;">10月30日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1970362c2025.aspx">13个最常用的Python深度学习库介绍</a></span>
<span class="c_nrtja5" style="color:gray;">10月30日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1970359c2025.aspx">深入理解Python中的*重复运算符</a></span>
<span class="c_nrtja5" style="color:gray;">10月30日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1970353c2025.aspx">python logging日志模块详解</a></span>
<span class="c_nrtja5" style="color:gray;">10月30日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1963425c2025.aspx">System表空间不足的报警问题浅析</a></span>
<span class="c_nrtja5" style="color:gray;">10月22日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1963424c2025.aspx">Android开发自定义TextView省略号样式的方法</a></span>
<span class="c_nrtja5" style="color:gray;">10月22日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1963423c2025.aspx">MySQL 清除表空间碎片的实例详解</a></span>
<span class="c_nrtja5" style="color:gray;">10月22日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1963422c2025.aspx">Ubuntu下MySQL安装及配置远程登录教程</a></span>
<span class="c_nrtja5" style="color:gray;">10月22日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1963421c2025.aspx">Python 2.x如何设置命令执行的超时时间实例</a></span>
<span class="c_nrtja5" style="color:gray;">10月22日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1963420c2025.aspx">windows 64位下redis安装教程</a></span>
<span class="c_nrtja5" style="color:gray;">10月22日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1963419c2025.aspx">Android 自定义 HorizontalScrollView 打造多图片OOM 的横向滑动效果</a></span>
<span class="c_nrtja5" style="color:gray;">10月22日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1963418c2025.aspx">浅谈Node Inspector 代理实现</a></span>
<span class="c_nrtja5" style="color:gray;">10月22日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1963417c2025.aspx">java web开发之购物车功能实现示例代码</a></span>
<span class="c_nrtja5" style="color:gray;">10月22日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1963416c2025.aspx">Android开发中GridView用法示例</a></span>
<span class="c_nrtja5" style="color:gray;">10月22日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1963415c2025.aspx">Django ORM框架的定时任务如何使用详解</a></span>
<span class="c_nrtja5" style="color:gray;">10月22日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1963414c2025.aspx">SpringMail使用过程中的报错解决办法</a></span>
<span class="c_nrtja5" style="color:gray;">10月22日</span>
</div>
<div class="c_nrtja3">
<span class="c_nrtja4"><a href="//www.reelogic.com/n1963413c2025.aspx">Android 使用自定义RecyclerView控件实现Gallery效果</a></span>
<span class="c_nrtja5" style="color:gray;">10月22日</span>
</div>
</div>
</div>
</div>
<div class="c_lbright_nr">
<div class="c_nr_lbxx1">
<div class="c_lbright_nr1bt1s">
<a href="//www.reelogic.com/wap/"> 移动网站</a>
</div>
</div>
<div class="c_nr_lbxx1">
<div class="c_lbright_nr1bt1">
最新信息
</div>
<div class="c_nr_lbxx_tui">
<div class="c_nr_xx_tui1">
<a href="//www.reelogic.com/n2295285c1180.aspx">2024年云南省交通投资建设集团有限公司管理人员校园招聘公告</a>
</div>
<div class="c_nr_xx_tui1">
<a href="//www.reelogic.com/n2295284c997.aspx">2024年文山州富宁县人民政府办公室考察调（流）动工作人员公告</a>
</div>
<div class="c_nr_xx_tui1">
<a href="//www.reelogic.com/n2295283c990.aspx">2024年宣威市教育体育局招聘公费师范毕业生资格复审、体检人员公示</a>
</div>
<div class="c_nr_xx_tui1">
<a href="//www.reelogic.com/n2295282c998.aspx">2024年中共勐海县委机构编制委员会办公室招聘公告</a>
</div>
<div class="c_nr_xx_tui1">
<a href="//www.reelogic.com/n2295281c1452.aspx">2025年中国邮政储蓄银行校园招聘公告</a>
</div>
<div class="c_nr_xx_tui1">
<a href="//www.reelogic.com/n2295280c991.aspx">2024年玉溪市通海县公安局招聘警务辅助人员1名</a>
</div>
<div class="c_nr_xx_tui1">
<a href="//www.reelogic.com/n2295279c288.aspx">2024年红河州开远市招考办成人高考报名公告</a>
</div>
<div class="c_nr_xx_tui1">
<a href="//www.reelogic.com/n2295278c1180.aspx">2024年中铁站城融合建设有限公司招聘</a>
</div>
<div class="c_nr_xx_tui1">
<a href="//www.reelogic.com/n2295277c1004.aspx">2024年中共双江自治县委社会工作部招聘公益性岗位公告</a>
</div>
<div class="c_nr_xx_tui1">
<a href="//www.reelogic.com/n2295276c992.aspx">2024年昭通市鲁甸机关事务服务中心招聘公告</a>
</div>
</div>
</div>
<div class="c_nr_lbxx1"></div>
<div class="c_nr_lbcd">
<div class="c_nr_cd1">
<img id="xlogo" src="//www.reelogic.com/pic/gwy.svg" width="20" height="20">公考类
</div>
<div class="c_nr_cd2">
<span class="c_nr_cd3"><a href="//www.reelogic.com/c1072.aspx">云南公务员</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c1220.aspx">贵州公务员</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c1219.aspx">四川公务员</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c1311.aspx">广西公务员</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c1252.aspx">各省公务员</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c1015.aspx">国家公务员</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c1253.aspx">选调遴选</a></span>
</div>
<div class="c_nr_cd1">
<img id="xlogo" src="//www.reelogic.com/pic/zp.svg" width="20" height="20">招聘类
</div>
<div class="c_nr_cd2">
<span class="c_nr_cd3"><a href="//www.reelogic.com/c934.aspx">188app金宝搏
</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c1431.aspx"></a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c1110.aspx">特岗教师</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c1291.aspx">三支一扶</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c1291.aspx">志 愿 者</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c1448.aspx">银行招聘</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c1124.aspx">国企招聘</a></span>
</div>
<div class="c_nr_cd1">
<img id="xlogo" src="//www.reelogic.com/pic/ks.svg" width="20" height="20">各类考试
</div>
<div class="c_nr_cd2">
<span class="c_nr_cd3"><a href="//www.reelogic.com/c690.aspx">学历升学</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c385.aspx"></a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c921.aspx">职业资格</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c373.aspx">外语考试</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c375.aspx">医学考试</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c225.aspx">工程考试</a></span>
<span class="c_nr_cd3"><a href="//www.reelogic.com/c823.aspx">教师资格</a></span>
</div>
</div>
</div>
</div>
<!-- <img src="http://admyn.ynpxrz.com/adv/hf.png" alt="" srcset=""> -->
<div class="c_gywm">
<a href="//www.reelogic.com/n38c56.aspx" target="_blank">关于我们</a>|
<a href="//www.reelogic.com/n76555c56.aspx" target="_blank">联系我们</a>|
<a href="//www.reelogic.com/n340264c1277.aspx" target="_blank">人才招聘</a>|
<a href="//www.reelogic.com/n3452c56.aspx" target="_blank">网站声明</a>|
<a href="//www.reelogic.com/n2514c56.aspx" target="_blank">网站帮助</a>|
<a href="//www.reelogic.com/memberNewsAdd.aspx" target="_blank">非正式的简要咨询</a>|
<a href="//www.reelogic.com/n21580c56.aspx" target="_blank">简要咨询须知</a>|
<a href="//www.reelogic.com/n4836c56.aspx" target="_blank">加入群交流</a>|
<a href="//www.reelogic.com/wap" target="_blank">手机站点</a>|
<a href="https://www.ynbxjy.com/tsjy.html" target="_blank">投诉建议</a>
</div>
<div class="c_gywm">
<span>工业和信息化部备案号：<a href="https://beian.miit.gov.cn/" target="_blank" rel="nofollow">滇ICP备2023014141号-1</a></span>
<span><a href="//www.reelogic.com/n48442c56.aspx" target="_blank">云南省教育厅备案号：云教ICP备0901021</a></span>
<span><a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=53010202001879" target="_blank" rel="nofollow">滇公网安备53010202001879号</a></span>
<span>人力资源服务许可证：（云）人服证字（2023）第0102001523号</span>
</div>
<div class="c_gywm1">
<div class="c_ga_1" style="width:200px;">
<a href="http://www.yn.cyberpolice.cn:81/RecValidate/RecView.aspx?RecordID=53010203402261" target="_blank" class="wjba" rel="nofollow"><img src="//www.reelogic.com/pic/gonganbeian.jpg" border="0" alt="云南网警备案专用图标" width="45" height="50"></a>
</div>
<div class="c_ga_2" style="width:700px;">
<span>联系电话：0871-65317125（9:00—18:00）</span>
<span>获取招聘考试信息及咨询关注公众号：</span>
<br>
<span>咨询QQ：526150442（9:00—18:00）</span>
<span>版权所有:<span style="font-weight: bold; font-family: arial;" id="iwms_cp"><a href="//www.reelogic.com"></a></span></span>
</div>
<div class="c_ga_3" style="width:200px;">
<a href="http://www.yn.cyberpolice.cn/" target="_blank" class="wjbj" rel="nofollow"><img src="//www.reelogic.com/pic/gonganbj.jpg" border="0" alt="云南网警报警专用图标" width="48" height="52"></a>
</div>
</div>
<!-- <script>
var _hmt = _hmt || [];
(function () {
var hm = document.createElement("script");
hm.src = "https://www.reelogic.com/hm.js?e5dabc539f2ab7c2f06ff8fce27ffff8";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script> -->
<div style="text-align:center;margin-bottom:5px;"><form action="http://www.baidu.com/baidu" target="_blank"><div bgcolor="#FFFFFF" style="text-align:center;"><input name="tn" type="hidden" value="baidu"><a href="http://www.baidu.com/"><img src="http://img.baidu.com/img/logo-80px.gif" width="80px" height="29px" alt="Baidu" align="bottom" border="0"></a><input type="text" name="word" size="30" placeholder="" value=""><input type="submit" value="baidu"></div></form></div><div id="so360" style="text-align:center;margin-bottom:5px;"><form action="https://www.so.com/" target="_blank" id="so360form"><img src="http://p1.qhimg.com/d/_onebox/search.png" width="100px" height="25px"> <input type="text" autocomplete="off" name="q" id="so360_keyword" placeholder="" value=""> <input type="submit" id="so360_submit" value="360"> <input type="hidden" name="ie" value="gbk"><input type="hidden" name="src" value="zz"> <input type="hidden" name="site" value="so.com"> <input type="hidden" name="rg" value="1"></form></div><div id="sogou" style="text-align:center;margin-bottom:5px;"><form action="https://www.sogou.com/" target="_blank" id="so360form"><img src="https://www.sogou.com/web/index/images/logo_440x140.v.4.png" width="100px" height="25px"> <input type="text" autocomplete="off" name="q" id="sogou.com_keyword" placeholder="" value=""> <input type="submit" id="sogou_submit" value="sougou"> <input type="hidden" name="ie" value="gbk"><input type="hidden" name="src" value="zz"> <input type="hidden" name="site" value="so.com"> <input type="hidden" name="rg" value="1"></form></div><div align="center"><a target="_blank" href="/sitemap.xml">map</a></div></body>
</html> 
事业单位
当前位置：