知识大全 网页最简短的拖动对象代码实例演示

Posted

篇首语:顾虑太多难以起步,背负太多难走远路。本文由小常识网(cha138.com)小编为大家整理,主要介绍了知识大全 网页最简短的拖动对象代码实例演示相关的知识,希望对你有一定的参考价值。

  以前在网上看到的最简单的拖动对象的代码 忘记作者叫什么了 原始代码在IE下有些小问题 并且声明了文档类型为x 后 在FF等非IE浏览器下无效 对其进行了改进 现在已经可兼容:IE Firefox Opera

<!doctype  public  //W C//DTD XHTML   Transitional//EN   transitional dtd > < xmlns=  lang= gb > <head> <title> 代码实例 拖动对象 Drag Object (兼容:IE Firefox Opera   )</title> <meta  equiv= content type  content= text/; charset=gb  /> <meta name= editor  content= 枫巖 > <meta name= keywords  content= 代码实例 拖动对象 > <meta name= description  content= 最简短的拖动对象代码实例演示 > <style> dragAble position:relative;cursor:move; </style> <script language= javascript > <! // Author:  Unkonw // Modify:  枫巖 var ie=document all; var nn =document getElementById&&!document all; var isdrag=false; var y x; var oDragObj; function moveMouse(e)   if (isdrag)   oDragObj style top  =  (nn  ? nTY + e clientY   y : nTY + event clientY   y)+ px ;  oDragObj style left  =  (nn  ? nTX + e clientX   x : nTX + event clientX   x)+ px ;  return false;   function initDrag(e)   var oDragHandle = nn  ? e target : event srcElement;  var topElement =  HTML ;  while (oDragHandle tagName != topElement && oDragHandle className !=  dragAble )   oDragHandle = nn  ? oDragHandle parentNode : oDragHandle parentElement;    if (oDragHandle className== dragAble )   isdrag = true;  oDragObj = oDragHandle;  nTY = parseInt(oDragObj style top+ );  y = nn  ? e clientY : event clientY;  nTX = parseInt(oDragObj style left+ );  x = nn  ? e clientX : event clientX;  document onmousemove=moveMouse;  return false;   document onmousedown=initDrag; document onmouseup=new Function( isdrag=false ); // > </script> </head> <body> <img src= _ / / gif  class= dragAble  /> <img src= _ / / gif  class= dragAble  /> <img src= _ / / gif  class= dragAble  /><br /><br /> <div  class= dragAble >这些都是可拖动对象</div> </body> </> cha138/Article/program/Java/JSP/201311/19506

相关参考

知识大全 批量实现面向对象的实例代码

本文为大家详细介绍下面向对象的继承以及如何实现批量实现面向对象感兴趣的可以参考下哈希望对大家有所帮助 复制代码代码如下:cha138/Article/program/Java/JS

知识大全 jquery简单的拖动效果实现原理及示例

本文为大家详细介绍下jQuery拖曵的简单实例具体的实现思路及代码如下感兴趣的朋友可以参考下哈希望对大家有所帮助 复制代码代码如下:cha138/Article/program/J

知识大全 jquery实现输入框动态增减的实例代码

主要功能是动态增减输入框而且支持对各个输入框的检测每个输入框在输入内容后对其进行错误提示   通过字符串拼接将所有的输入框中的内容用“##”这样的格式拼接网页端代码复制代码代码如下:<

知识大全 在网页中显示可拖动的月历

 使用本文提供的javascript脚本配合Dreamweaver的层和行为的运用可以在页面中显示可拖动的精美月历  具体制作步骤如下  启动DreamweaverMX新建一个HTML文档切

知识大全 面向对象继承实例(a如何继承b问题)(自写)

经常会看到a如何继承b的问题决定写一下其实继承就是继承父级的属性和方法感兴趣的朋友可以参考下哈希望对大家有所帮助 复制代码代码如下:cha138/Article/program/J

知识大全 VB.NET 拖动无边框窗体编程实例

VB.NET拖动无边框窗体编程实例  以下文字资料是由(全榜网网www.cha138.com)小编为大家搜集整理后发布的内容,让我们赶快一起来看一下吧!    Impor

知识大全 js实现拉伸拖动iframe的具体代码

这篇文章介绍了js实现拉伸拖动iframe的具体代码有需要的朋友可以参考一下   左边iframe放树目录右边的iframe放index页拖鼠标同时控制个iframe的宽高期待有人能改进操作

知识大全 jQuery对元素进行拖动并重新排序代码

jQuery对元素进行拖动并重新排序代码  以下文字资料是由(全榜网网www.cha138.com)小编为大家搜集整理后发布的内容,让我们赶快一起来看一下吧!本文章来给各

知识大全 Struts开发指南之工作流程实例演示

Struts开发指南之工作流程实例演示  以下文字资料是由(全榜网网www.cha138.com)小编为大家搜集整理后发布的内容,让我们赶快一起来看一下吧!  下图是St

知识大全 js展开闭合效果演示代码

本文为大家介绍下js如何实现展开闭合效果具体代码如下感兴趣的朋友可以参考下哈希望对大家有所帮助 复制代码代码如下:<!DOCTYPEPUBLIC"//WC//DTDXHTMLTrans