ondragstart 事件在用户开始拖动元素或选择的文本时触发。

拖放是 HTML5 中非常常见的功能。 更多信息可以查看我们 HTML 教程中的 HTML5 拖放

注意: 为了让元素可拖动,需要使用 HTML5 draggable 属性。

提示: 链接和图片默认是可拖动的,不需要 draggable 属性。

在拖放的过程中会触发以下事件:

    • 在拖动目标上触发事件 (源元素):

      • ondragstart - 用户开始拖动元素时触发
      • ondrag - 元素正在拖动时触发
      • ondragend - 用户完成元素拖动后触发
    • 释放目标时触发的事件:

      • ondragenter - 当被鼠标拖动的对象进入其容器范围内时触发此事件
      • ondragover - 当某被拖动的对象在另一对象容器范围内拖动时触发此事件
      • ondragleave - 当被鼠标拖动的对象离开其容器范围内时触发此事件
      • ondrop - 在一个拖动过程中,释放鼠标键时触发此事件

ondrag事件的更多相关文章

  1. 浏览器根对象window之事件

    1. [事件]动画 onanimationstart onanimationend onanimationiteration onwebkitanimationend onwebkitanimatio ...

  2. drag与drop事件

    为了支持网页上一些元素的拖动效果,可以使用drag和drog事件. 目前ie 5.0+, firefox 3.5+等都支持这些事件,ECMA Script第5版正式将其纳入标准. 对于被拖动的元素来说 ...

  3. H5拖动事件复习

    定义和用法 ondrag 事件在元素或者选取的文本被拖动时触发. 拖放是 HTML5 中非常常见的功能. 更多信息可以查看我们 HTML 教程中的 HTML5 拖放. 注意: 为了让元素可拖动,需要使 ...

  4. unity 使用OnDrag实现物体旋转

    通过监听UGUI的OnDrag事件 实现对3D物体的旋转 实现IDragHandler接口 void IDragHandler.OnDrag(PointerEventData eventData) { ...

  5. HTML5 — 让拖放变的流行起来

    先上 Demo,尽量用 chrome,代码可参考 Github. 在 HTML5 出现之前,页面元素的拖放需要监听 mousedown.mouseover 以及 mouseup 等一系列事件,然后改变 ...

  6. Unity3D UGUI中ScrollRect的一些知识点

    需求 这几天在公司里,项目需要将游戏游戏中的2D城堡界面在拉动的时候显示出3D的拉近效果.当时是在Cocos2d-x下实现的.回家的时候自己重新用Unity实现的了一遍. 虽然现在Unity已经到了5 ...

  7. 【Unity3D】【NGUI】UICamera

    原文:http://www.tasharen.com/forum/index.php?topic=6711.0 NGUI讨论群:333417608 概述 UICamera这个名字不是很合适,保留的原因 ...

  8. 纯javascript实现可拖住/大小的div

    好久没写了,不得不说人懒了好多.. 也不打算实现什么太厉害的功能,因为不喜欢网上那些一大堆代码的,看的头晕,于是自己写了一个 旨在越简单越好(当然也走点形式- -其实是自己菜),所以一些宽度和高度都写 ...

  9. H5C302

    H5C302 1.网络监听端口 ononline及onoffline事件 2.全屏接口 注意:在使用时不同浏览器需要添加不同的前缀: chrome:webkit firefox:moz ie:ms o ...

随机推荐

  1. Coreseek:第一步配置文件

    Windows操作系统下:mysql数据源配置:(相应coreseek-3.2.13-win32/etc/csft_mysql.conf) #源定义 source mysql { type = mys ...

  2. struts2防止表单重复提交的解决方案

    一.造成重复提交主要的两个原因:    在平时的开发过程中,经常可以遇到表单重复提交的问题,如做一个注册页面,如果表单重复提交,那么一个用户就会注册多次,重复提交主要由于两种原因. 1. 一是,服务器 ...

  3. Lucene用法10个小结 (zhuan)

    http://www.cfanz.cn/index.PHP?c=article&a=read&id=303149 *********************************** ...

  4. redhat6.8服务器版本 yum 源的配置

    阿里云的源地址: http://mirrors.aliyun.com/ 打开后点击帮助: 有如下提示: 不过不能直接使用这个源,因为自己使用的是服务器版本,要修改一个变量,先将源文件下载下来. wge ...

  5. RabbitMQ之发布订阅【译】

    在上一节中我们创建了一个工作队列,最好的情况是工作队列能够把任务恰到好处的分配给每一个worker.这一节中我们将做一些完全不同的事情--将消息传递给每一个消费者,这种模式被称为发布/订阅. 为了说明 ...

  6. exchange邮箱系统增加验证码机制

    首先背景是exchange的邮箱系统没有后台源代码.因为这个原因,生成验证码的机制放在aspx的runat="sever"后台代码里面. 首先需要找到iis中logon.aspx文 ...

  7. Hibernate Annotation 字段 默认值

    http://emavaj.blog.163.com/blog/static/133280557201032262741999/ ——————————————————————————————————— ...

  8. 【BZOJ】1664: [Usaco2006 Open]County Fair Events 参加节日庆祝(线段树+dp)

    http://www.lydsy.com/JudgeOnline/problem.php?id=1664 和之前的那题一样啊.. 只不过权值变为了1.. 同样用线段树维护区间,然后在区间范围内dp. ...

  9. Android studio 添加admob googgle play services

    Android studio 添加admob googgle play services MainActivity import com.google.android.gms.ads.AdReques ...

  10. hdu 1358:Period(KMP算法,next[]数组的使用)

    Period Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Subm ...