html5 drag and drop

注:链接、图片默认是draggable的。
mousemove在整个拖放的过程中不会被触发。
dragStart设置:
e.dataTransfer.effectAllowed = "move";
e.dataTransfer.setData("text", e.target.innerHTML);
e.dataTransfer.setDragImage(e.target, 0, 0);
return true;
dragEnd设置:
e.dataTransfer.clearData("text");
return false;
dragEnter设置:
return true;
dragOver设置:
e.preventDefault();//针对IE阻止链接的跳转行为
return true;
drop设置:
return false;
html5 drag and drop的更多相关文章
- HTML5 drag和drop的亲手实践
起因 最近在公司打杂的时候,突然分到了一个锅,就是要支持一个新的功能:用户可以通过拖曳组件来改变组件的顺序.因此,这阵子就看了一下网上的一些drag和drog的文章以及W3C的介绍,然后自己亲手实践了 ...
- 20 Best Drag and Drop jQuery Plugins--reference
reference from:http://dizyne.net/20-best-drag-drop-jquery-plugins/ jQuery has done a great job repla ...
- angularjs drag and drop
angular-dragula Drag and drop so simple it hurts 480 live demo angular-drag-and-drop-lists Angular d ...
- 使用 Drag and Drop 给Web应用提升交互体验
什么是 Drag and Drop (拖放)? 简单来说,HTML5 提供了 Drag and Drop API,允许用户用鼠标选中一个可拖动元素,移动鼠标拖放到一个可放置到元素的过程. 我相信每个人 ...
- HTML5 之拖放(drag与drop)
拖放(Drag 和 drop)是 HTML5 标准的组成部分. 拖放是一种常见的特性,即抓取对象以后拖到另一个位置. 在 HTML5 中,拖放是标准的一部分,任何元素都能够拖放. HTML5 拖放实例 ...
- 通过HTML5的Drag and Drop生成拓扑图片Base64信息
HTML5 原生的 Drag and Drop是很不错的功能,网上使用例子较多如 http://html5demos.com/drag ,但这些例子大部分没实际用途,本文将搞个有点使用价值的例子,通过 ...
- 基于HTML5的Drag and Drop生成图片Base64信息
HTML5的Drag and Drop是很不错的功能,网上使用例子较多如 http://html5demos.com/drag ,但这些例子大部分没实际用途,本文将搞个有点使用价值的例子,通过Drag ...
- [转]人人网首页拖拽上传详解(HTML5 Drag&Drop、FileReader API、formdata)
人人网首页拖拽上传详解(HTML5 Drag&Drop.FileReader API.formdata) 2011年12月11日 | 彬Go 上一篇:给力的 Google HTML5 训练营( ...
- HTML5 拖放(Drag 和 Drop)功能开发——基础实战
随着HTML5的普及度越来越高,现在写代码也遇到一些了,经过同事的点播开展了一次Dojo活动用以技术交流,我也乘此机会将HTML5的拖放功能整理了一下. 简介 拖拽(Drag/Drop)是个非常普遍的 ...
随机推荐
- 类似网易新闻 title栏 滚动时 文字放大&变色
http://files.cnblogs.com/files/n1ckyxu/ScrollTitleView.zip
- Kafka - protocol
http://kafka.apache.org/protocol 具体的协议看原文, Preliminaries Network Kafka uses a binary protocol ov ...
- Linux内核设计第二周——操作系统工作原理
Linux内核设计第二周 ——操作系统工作原理 作者:宋宸宁(20135315) 一.实验过程 图1 执行效果 从图中可以看出,每执行my_ start_ kernel函数两次或一次,my_ time ...
- ajax同步、异步执行简单理解与证明
此理解范例代码来自前几篇随笔! 首先我们来先了解下AJAX: Ajax:全称“Asynchronous Javascript and XML”(异步Javascript和XML),他是由Javascr ...
- 【C++】const
1. 默认状态下,const对象仅在文件内有效,即在不同文件中出现同名const变量的时候,其实相当于这些同名const是不同的东西. 如果想要在文件中共享const变量,可以在const变量不管是声 ...
- Codeigniter2.25部署Linux(php5.6)
1).默认路由:修改system/core/Router.php 中第146行.如下图所示.ps:转换成小写我也是醉了...注释的代表是codeigniter作者写的,而上面的是我更改的 2).mod ...
- Netty4.x中文教程系列(四) ChannelHandler
这篇文章用以解释ChannelHandler.笔者本身在以前写过文章ChannelHandler改动及影响 和 ChannelInitializer 学习 对Netty的.ChannelHandler ...
- paper 100:何恺明经典去雾算法
一:由简至美的最佳论文(作者:何恺明 视觉计算组) [视觉机器人:个人感觉学习他的经典算法固然很重要,但是他的解决问题的思路也是非常值得我们学习的] 那是2009年4月24日的早上,我收到了一封不同 ...
- C语言 在VS环境下一个很有意思的报错:stack around the variable was corrupted
今天做一个很简单的oj来温习下c 语言 题目如下 输入 3位正整数 输出 逆置后的正整数 代码如下: #include"stdio.h"int main(){ float h,su ...
- elasticsearch客户端连接选择
elasticsearch支持两种协议: http协议. Native Elasticsearch binary protocol(本地elasticsearch二进制协议):elasticsearc ...