html5
http://www.w3school.com.cn/html5/index.asp从这个网站开始一点点累积
初步了解:html5 是下一代的html
html5建立规则:
基于html,css,dom以及JavaSctipt
用于绘画的canvas元素
用于媒介回放的video和audio元素
对本地离线存储的更好支持
特殊内容元素:article,footer,header,nav,section
表单控件:calendar,date,time,email,Url,search
浏览器:safari,chrome,firefox以及orera
html5视频:
当前video支持三种视频格式:
Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件 目前firefox 3.5+,Opera 10.5+,Chrome 5.0+ 支持该格式
MPEG4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件 目前IE9.0+,Chrome5.0+,Safari 3.0+支持该格式
WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件 目前Firefox 4.0+,Opera 10.6+,Chrome6.0+支持该格式
也就是说目前Chrome 6.0+以上版本对以上格式都是支持的,IE只支持MPEG4格式还是得需要9.0以上版本,与IE走相同支持路线的就是Safari在3.0以上版本也仅支持MPEG4
Firefox和Opera走的是相同路线,没有对MPEG4的支持,但是分别支持了Ogg格式和WebM格式
总结来说:
操作系统自带的浏览器支持的是MPEG 4
做搜索的巨头造的浏览器全面支持
第三方浏览器Firefox和Opera不支持MPEG 4
在html5 中显示视频非常简单只需在代码中添加:
或者:
Your browser does not support the video tag.
上面的controls熟悉供添加播放,暂停和音量控件
之间的内容是供不支持video元素的浏览器显示的
其次还可以制定video的宽度和高度:
Your browser does not support the video tag.
为了适配多个浏览器,可猜测在做适配,浏览器将使用第一个可识别的格式:
Your browser does not support the video tag.
video结合DOM可以良好的对video进行控制,可以直接在
对数据的放置和获取使用的ev.dataTransfer.getData("Text") 获取数据,参数是数据的类型
ev.dataTransfer.setData("Text",ev.target.id);