如图
可以从第一个方框拖拽花色到第二个方框中。
也可以再拖动回来。
具体代码实现
index.html
HTML5 Drag && Drop Demo
function DragHandler(target, e) {
e.dataTransfer.setData('Text', target.id);
}
function DropHandler(target, e) {
var id = e.dataTransfer.getData('Text');
target.appendChild(document.getElementById(id));
e.preventDefault();
}HTML5 Drag & Drop Demo
main.css
.dndbox
{
width:300px;
height:300px;
border:1px solid #000;
}HTML5之拖拽(兼容IE和非IE)
前世:项目中需要拖动div,然后和某个div进行位置交换,这不是关键,关键是还要保存位置,然后在下次打开的时候按照保存的位置显示.还好本人功力深厚,一下子就想到了用localStorage来保存,事实 ...
html5 文件拖拽上传
基于html5可拖拽图片循环滚动切换
分享一款基于html5可拖拽图片循环滚动切换.这是一款支持手机端拖拽切换的网站图片循环滚动特效.效果图如下: 在线预览 源码下载 实现的代码. html代码:
HTML5原生拖拽/拖放⎡Drag &; Drop⎦详解前言 拖放(drap && drop)在我们平时的工作中,经常遇到.它表示:抓取对象以后拖放到另一个位置.目前,它是HTML5标准的一部分.我从几个方面学习并实践这个功能. 拖放的流程 ...
HTML5原生拖拽/拖放(drag &; drop)详解前言 拖放(drap && drop)在我们平时的工作中,经常遇到.它表示:抓取对象以后拖放到另一个位置.目前,它是HTML5标准的一部分.我从几个方面学习并实践这个功能. 拖放的流程 ...
随机推荐
SSH学习笔记
Struts2登录模块处理流程: 浏览器发送请求http://localhost/appname/login.action,到web应用服务器: 容器接收到该请求,根据web.xml的配置,服务器将请 ...
Mouse.OverrideCursor介绍: 获取和设置整个应用程序的光标,WPF父元素将覆盖所有子元素的光标. WPF设置控件的光标: WPF 中每个光标通过一个System.Windows.Input.Cursor表示, 获取Curs ...
快速求n的质因子(数论)
快速求n的质因子 如何尽快地求出n的质因子呢?我们这里又涉及两个好的算法了! 第一个:用于每次只能求出一个数的质因子,适用于题目中给的n的个数不是很多,但是n又特别大的 #include
HDOJ 1466 计算直线的交点数
将n 条直线排成一个序列,直线2和直线1最多只有一个交点,直线3和直线1,2最多有两个交点,......,直线n 和其他n-1条直线最多有n-1个交点.由此得出n条直线互不平行且无三线共点的最多交点数 ...
C Primer Plus 第5章 运算符、表达式和语句 编程练习
1. #include ; int main(void) { int min, hour, lmin; printf("请输入分钟数: \n"); ...Windows 注册和取消注册一个dll或者ocx
原文:Windows 注册和取消注册一个dll或者ocx 一.DLL是什么 DLL,是Dynamic Link Library 的缩写形式,中文名称为动态链接库. DLL是 ...
hdu1068 Girls and Boys 二分匹配
题目链接: 二分匹配的应用 求最大独立集 最大独立集等于=顶点数-匹配数 本体中由于男孩和女孩的学号是不分开的,所以匹配数应是求得的匹配数/2 代码: #include ...
利用CocoaHTTPServer实现wifi局域网传输文件到iphone
背景 近日在做一个代码阅读器,其中涉及到代码文件的上传,之前看到过许多app支持局域网传文件,因此就通过查询和研究实现了此功能,我是用的框架是CocoaHTTPServer. 原理 CocoaHTTP ...
NRF51822之FICR
uint32_t deviceID[2];union{ uint32_t DW; uint8_t B[4];} device_ID;//read device ID deviceID ...
