C#133课的主要内容
来源:互联网 发布:php怎么开启exec函数 编辑:程序博客网 时间:2024/05/22 14:08
今天主要学习了一下知识点:
HTML5拖放
请把w3school图片拖到矩形中
拖放
拖放是很常见的特性,它指的是你抓取某物并拖入不同的位置。
拖放是HTML5标准的组成部分:任何元素都是可拖放的。
浏览器支持
表格中的数字指示了完全支持拖放的首个浏览器版本
HTML拖放实例
把元素设置为可拖放
首先:为了把一个元素设置为可拖放,请把draggable属性设置为true:
拖放的内容-ondragstart 和 setData()
然后,规定当元素被拖动时发生的事情。
在上面的例子中,ondragstart 属性调用了一个drag(event)函数,规定拖动什么数据。
dataTransfer,setData()方法设置被拖动数据的数据类型和值:
在本例中,数据类型是“text”,而值是这个可拖动元素的id("drag1")
拖动何处-ondragover
ondragover 事件规定被拖动的数据能够被放置到何处。
默认地,数据、元素无法被放置到其他元素中,为了实现拖放,我们必须阻止元素的这种默认的处理方式
这个任务由ondragover事件的event.preventdefault()方法完成;
进行放置-ondrop
当放开被拓数据时,会发生drop事件
在上面的例子中,ondrop属性调用了一个函数,drop(event):
代码解释:
调用preventDefault()来阻止数据的浏览器默认处理方式(drop事件的默认行为是以连接形式打开)
通过dataTransfer,getData() 方法获得被拖得数据。该方法将返回setData()方法中设置为相同类型的任何数据
被拖数据是被拖元素的id("drag1")
把被拖元素最佳到放置元素中
更多实例
来回拖放图片
如何在两个<div> 元素之间来回拖放图像
- C#133课的主要内容
- C#的25课主要内容
- C#的29课主要内容
- C#30课的主要内容
- C#31课的主要内容
- C#32课的主要内容
- C#33课的主要内容
- C#35课的主要内容
- C#37课的主要内容
- C#38课的主要内容
- C#39课的主要内容
- C#40课的主要内容
- C#43课的主要内容
- C#44课的主要内容
- C#45课的主要内容
- C#46课的主要内容
- C#47课的主要内容
- C#49课的主要内容
- 摄像机跟谁玩家,鼠标中间控制视距的学习代码
- PID算法浅析
- 多线程中的并发、并行、同步、异步
- MAC的备份注意点
- MyBatis 源码分析——动态代理
- C#133课的主要内容
- LeetCode43 Multiply Strings
- Linux 命令 练习 —02
- Linux下基于Platform的led驱动(二)——测试
- LeetCode045 Jump Game II
- 堆的应用
- LeetCode044 Wildcard Matching
- 20170407工作日记
- Useful Links for Statement of Purpose for CS Graduate Application,CS研究生申请SOP有用链接