初识html5 博客分类： html5 html5video

html5的一些新特性：

1.添加了<video>和<audio>媒体文件

2.支持本地文件存储

3.新的内容控制元素，如<article>、<footer>、<header>、<nav>和<section>

4.新的表单控件，如: calendar、date、time、email、url和search

 

浏览器对html5的支持：

html5不是官方的标准，所以并没有浏览器完全支持hmtl5

但是所有的主流浏览器如：Firefox、Opera、Chrome等都相继的把html5的新特性添加到最新版本的浏览器中

 

自从1999年的HTML 4.0.1版本以后，因特网有了很大的改变。

现在，HTML 4.0.1中的一些元素已经被丢弃，不会再使用，这些元素在html5中已经被移除或者被重写。

为了更好的使用因特网，html5中添加了更好容易架构和处理的的新元素

 

在html5中嵌入视频变得非常的简单：

首先得确保你所用的浏览器是支持html5 video

知道现在，大多数的视频都是通过插件如 flash来播放，在网页上播放视频并没有一个标准。

html5定义一个标签指定了一种标准的方式将视频文件嵌入到网页： <video>元素

浏览器支持：

Internet Explorer 9, Firefox, Opera, Chrome, and Safari支持 <video> element.

Internet Explorer 8以及更早的版本并不支持<video>元素

下面用一个例子来在网页上嵌入视频文件：

在html5的body中加入下面的代码：

	<video width="320" height="240" controls="controls">
		<source src="movie.mp3" type="video/mp4" />
		Your browser does not support the video tag.
	</video>

 在使用的时候最好给添加上宽度和高度，这样在网页加载不至于出现布局问题，在video的标签中间加上 Your browser does not suppot the video tag，这样如果当前的浏览器不支持video的时候能给用户一个提示

html5 的 video 元素也有方法、属性和事件

播放事件： playing，pausing和loading

给播放器设置不同的事件，播放和停止事件，频幕的大小事件：

body的内容如下：

	The content of the document ....
	<br />
	<div style="text-align:center"> 
			<button onclick="playPause()">Play/Pause</button> 
			<button onclick="makeBig()">Big</button>
			<button onclick="makeSmall()">Small</button>
			<button onclick="makeNormal()">Normal</button>
		<br /> 
		<video id="myVideo" width="320" height="240" controls="controls">
			<source src="movie.mp3" type="video/mp4" />
			Your browser does not support the video tag.
		</video>
	</div>
	<script type="text/javascript"> 
		var myVideo=document.getElementById("myVideo"); 

		function playPause()
		{ 
			if (myVideo.paused) 
				myVideo.play(); 
			else 
				myVideo.pause(); 
		} 

		function makeBig()
		{ 
			myVideo.width=560; 
		} 

		function makeSmall()
		{ 
			myVideo.width=320; 
		} 

		function makeNormal()
		{ 
			myVideo.width=420; 
		} 
	</script>