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. Decoration6:改数据结构为继承的关系

    一个家装市场有各种登录的角色:设计师.业主…… 这些角色有一些共同的字段,例如passWord,userName,age等等,但是分别又有自己的一些特殊字段,例如设计师要写自己的设计经历,业主可能要有 ...

  2. XCode5中新建工程后强制使用了ARC,如何去掉?

    打开你的工程,点击目录的工程文件,最顶端蓝色的,然后选择project下你的工程,还是蓝色那项,然后build Settings,然后往下拉,在Apple LLVM 5.0 - Language - ...

  3. PL/SQL developer连接oracle出现“ORA-12154:TNS:could not resolve the connect identifier specified”问题的解决

    转载请注明出处:http://blog.csdn.net/dongdong9223/article/details/50728536 本文出自[我是干勾鱼的博客] 使用PL/SQL developer ...

  4. ubuntu 16.04LTS

    安装出现"server64 busybox-initramfs安装失败" 这个是BUG,解决方法一:初次安装选择语言时,使用English,在后面还会有一个选择语言的界面,这时候再 ...

  5. [持续更新]Windows Programming常见Hungarian Notation/Abbreviation大全

    Windows Programming必须了解的naming-convention,下面解释每个前缀/缩略词的含义,如果含义的解释一行放不下的,就把解释放在一个引用框里 PrefixMeaningCS ...

  6. 部署静态页面到nginx

    1.将页面上传到某个位置.比如:/home/myapp/navi 2. server_name localhost;  localhost 更换为自己的域名 3.更改配置文件./usr/local/n ...

  7. Eclipse “cannot be resolved to a type” error

    引言:     eclipse新导入的项目经常可以看到"XX cannot be resolved to a type"的报错信息.本文将做以简单总结. 正文:     (1)jd ...

  8. signal基础

    signal man 7 signal 1.kill -l 显示所有信号 kill -signal PID killall -signal name 2.产生信号 ctrl+c => SIGIN ...

  9. asp.net 列表样式

    找了好一段时间,找到一个不错的文章列表样式,留起来备用 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&qu ...

  10. 深度剖析java编码,彻底解决java乱码问题_1

    理解: 1,Java编译器(即编译成class文件时) 用的是unicode字符集. 2,乱码主要是由于不同的字符集相互转换导致的,理论上各个字符的编码规则是不同的,是不能相互转换的,所以根本解决乱码 ...