HTML5学习记录一:播放视频,音频和拖放

原创 2013年12月06日 11:40:02
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<style type="text/css">
  #div1 {width:350px;height:200px;padding:5px;}
  #div1 {border:2px solid red;}
</style>
<script type="text/javascript">
  function allowDrop(ev)
  {
	ev.preventDefault();  
  }
  function drag(ev)
  {
	  ev.dataTransfer.setData("Text",ev.target.id);  
  }
  function drop(ev)
  {
	ev.preventDefault();
	var data = ev.dataTransfer.getData("Text");
	ev.target.appendChild(document.getElementById(data));  
  }
</script>
<title>HTML5 学习记录一</title>
</head>
<body>
<div id="div1" border-width="2px" boder-color="#009" ondrop="drop(event)" ondragover="allowDrop(event)">
</div>
<br/>
<img id="drag1" src="菜品图片/small image/小图/仔姜排骨.png" style="cursor:pointer" draggable="true" onDragStart="drag(event)"></img>
  <video  style="cursor:pointer" width="320" height="190" src="test.MP4" controls>
  加载失败
  </video>
</body>
</html>

相关文章推荐

直接在低版本IE6/7/8浏览器中使用HTML5的audio和video标签播放视频音频的办法

 虽然我的mp4格式的视频 还是没播放起来 但觉得 这些 还是很有参考价值的 支持低版本IE的html5播放器演示 点我查看演示页面 通常人们习惯用swf播放器来播放...

Html5(5)视频、音频 及 拖放

音频元素 自定义control 控件的方法: 如图 视频元素 兼容浏览器的方法: 如图 HTML5 拖放功能一、拖放页内元素 使用标准:Drag 和 drop 使用步骤:①...

html5播放视频

  • 2015年12月21日 20:00
  • 97KB
  • 下载

HTML5 - 使用<video>播放视频

1,下面是一个播放视频的最简单样例 (controls属性告诉浏览器要有基本播放控件)2,通过width和height设置视频窗口大小3,预加载媒体文件 设置preload不同的属性值...

html5播放视频

  • 2015年09月27日 09:26
  • 746KB
  • 下载

IIS7下,使用html5的video,无法播放视频

IIS7下,使用html5的video,无法播放视频

Html5结合flash在所有主流播放器播放视频的方法

转自http://www.aimks.com/html5-combined-with-flash-method-in-all-mainstream-video.html Html5结合flash...

关于HTML5中video标签在webstorm中使用绝对路径不能播放视频的解析

HTML5的新特性中出现了一个非常6的标签,这个标签的功能就是让多媒体文件可以很方便的在网页中播放。          HTML样例:     video src="功夫瑜伽.mp4" control...

HTML5 - 使用<video>播放视频

1,下面是一个播放视频的最简单样例  (controls属性告诉浏览器要有基本播放控件) video src="hangge.mp4" controls>video>11 2,通过w...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:HTML5学习记录一:播放视频,音频和拖放
举报原因:
原因补充:

(最多只允许输入30个字)