HTML5的拖拽时间 ondragstart
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>dragable</title>
</head>
<body>
<h1 draggable="true">time</h1>
<span id="clock" draggable="true">time_span</span>
<img src="12.png" />
<textarea cols="60" rows="20"></textarea>
<script>
(function(){
var clock = document.getElementById('clock');
var icon = new Image();
icon.src = "12.png"; function displayTime(){
var now = new Date();
clock.innerHTML = now.getMinutes();
setTimeout(arguments.callee,6000);
};
displayTime(); clock.ondragstart = function(ev){
var dt = ev.dataTransfer; //event里面有一个dataTransfer,这栋西很重要,setData,就是将数据保存到一个缓冲中,然后,就可以放到textarea看到数据了
dt.setData("Text",Date(),"\n");
if(dt.setDargImage)dt.setDragImage(icon,0,0)
}
})()
</script>
</body>
</html>
//来自于西牛叔 p472页
HTML5的拖拽时间 ondragstart的更多相关文章
- HTML5之拖拽(兼容IE和非IE)
前世:项目中需要拖动div,然后和某个div进行位置交换,这不是关键,关键是还要保存位置,然后在下次打开的时候按照保存的位置显示.还好本人功力深厚,一下子就想到了用localStorage来保存,事实 ...
- html5 文件拖拽上传
本文首先发表在 码蜂笔记 : http://coderbee.net/index.php/web/20130703/266 html5 文件拖拽上传是个老话题了,网上有很多例子,我一开始的代码也是网 ...
- 基于html5可拖拽图片循环滚动切换
分享一款基于html5可拖拽图片循环滚动切换.这是一款支持手机端拖拽切换的网站图片循环滚动特效.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div id="s ...
- HTML5 实现拖拽
如图 可以从第一个方框拖拽花色到第二个方框中. 也可以再拖动回来. 具体代码实现 index.html <!DOCTYPE HTML> <html> <head> ...
- HTML5原生拖拽/拖放⎡Drag & Drop⎦详解
前言 拖放(drap && drop)在我们平时的工作中,经常遇到.它表示:抓取对象以后拖放到另一个位置.目前,它是HTML5标准的一部分.我从几个方面学习并实践这个功能. 拖放的流程 ...
- HTML5原生拖拽/拖放(drag & drop)详解
前言 拖放(drap && drop)在我们平时的工作中,经常遇到.它表示:抓取对象以后拖放到另一个位置.目前,它是HTML5标准的一部分.我从几个方面学习并实践这个功能. 拖放的流程 ...
- html5的拖拽dragAPI(如果看了API不懂,看看那三个案例就会恍然大悟)
1.拖拽和释放定义: 拖拽:Drag; 释放:Drop; 2.源对象和目标对象: 3.相关API: ondragstart:源对象开始被拖动 ondrag:源对象被拖动的过程中 ondragend:源 ...
- HTML5之拖拽
HTML5拖放 拖放(Drag和drop)是H5标准的组成部分 此处需具备js基础知识及其H5拖拽部分相关方法 在拖动目标上触发事件 (源元素): ondragstart - 用户开始拖动元素时触发 ...
- 关于HTML5的拖拽
不介绍具体情况,先看API,注意看后面括号的说明 dragstart:拖拽开始(应用于被拖拽对象) drag:拖拽中(应用于被拖拽对象) dragenter:拖拽到指定位置(应用于拖拽目标) drag ...
随机推荐
- 【Android UI设计与开发】1.引导界面(一)ViewPager介绍和简单实现
1.ViewPager 实现效果图 2.ViewPager 实现功能 ViewPager类提供了多界面切换的新效果,新效果有如下特征: <1>当前显示一组界面中的其中一个界面: <2 ...
- 【读书笔记《Android游戏编程之从零开始》】15.游戏开发基础(剪切区域)
剪切区域也称为可视区域,是由画布进行设置的:它指的是在画布上设置一块区域,当画布一旦设置了可视区域,那么除此区域外,绘制的任何内容都将看不到:可视区域可以是圆形.矩形等等. 画布提供了三种设置可视区域 ...
- POJ2488-A Knight's Journey(DFS+回溯)
题目链接:http://poj.org/problem?id=2488 A Knight's Journey Time Limit: 1000MS Memory Limit: 65536K Tot ...
- (转)priority_queue的用法
priority_queue调用 STL里面的 make_heap(), pop_heap(), push_heap() 算法实现,也算是堆的另外一种形式.先写一个用 STL 里面堆算法实现的与真正的 ...
- Mecanim的Retargeting和BodyMask
Retargeting(动画重定向) 文档 http://game.ceeger.com/Manual/Retargeting.html 介绍 Mecanim 的最强大的功能之一,重定目标的仿人机器人 ...
- Linux命令学习-date
date命令可以用来显示和修改系统日期时间,注意不是time命令. 1.在命令行输入date显示当前时间 [root@vm4 logs]# dateSat Nov 22 00:00:02 CST 20 ...
- mysqli_stmt预处理类
<?php $mysqli=new mysqli("localhost", "root", "123456", "xsph ...
- Linq中查询List组合相同值数量大于1
List< select g.Key).ToList();
- php安全配置记录
Php环境部署完成后,通常我们会进行一些安全设置.除了熟悉各种PHP漏洞外,还可以通过配置php.ini来加固PHP的运行环境.PHP官方也曾经多次修改php.ini的默认设置. 接下来,推荐php. ...
- Android_firstClass
一个Project 创建后,大概的文件目录如下:在Android Studio每个Project,相当于Eclipse 的WorkSpace:每个Module(上图的app 目录)相当于Eclipse ...