现在HTML5用的越来越多。HTML制作的页面让人眼花缭乱，有些功能很容易实现。比如HTML5实现视频和音频播放。
HTML5将成为HTML、XHTML和HTML DOM的新标准。
HTML5的新特性:
绘画用画布元素
用于媒体播放的视频和音频元素
更好地支持本地离线存储
新的特殊内容元素，如文章、页脚、页眉、导航、部分
新的表单控件，如日历、日期、时间、电子邮件、url和搜索
浏览器支持
最新版本的Safari、Chrome、Firefox和Opera支持一些HTML5功能。Internet Explorer 9将支持一些HTML5功能。
齐步行进步速
目前，video元素支持三种视频格式:
格式IEFirefoxOperaChromeSafari
oggno 3.5+10.5+5.0+nom peg 49.0+nono 5.0+3.0+webmno 4.0+10.6+6.0+No
Ogg =带有Theora视频编码和Vorbis音频编码的Ogg文件
MPEG4 =采用H.2***视频编码和AAC音频编码的MPEG4文件
WebM =带有VP8视频编码和Vorbis音频编码的WebM文件
示例源代码:
& lt！DOCTYPE html & gt
& lthtml & gt
& lthead & gt
& ltmeta charset = \ & # 8221UTF-8 \ ”& gt
& lttitle & gt播放视频
& lt/head >
& ltbody & gt
& ltdiv style = \ & # 8221文本对齐:居中；\”& gt
& ltbutton onclick = \ & # 8221play pause()\ ”& gt播放/暂停
& ltbutton onclick = \ & # 8221***ke big()\ ”& gt大
& ltbutton onclick = \ & # 8221***ke nor***l()\ ”& gt中型
& ltbutton onclick = \ & # 8221***ke ***all()\ ”& gt小
& ltbr/>；
& lt视频id = \ & # 8221视频1 \ ”width = \ & # 8221420\”style = \ & # 8221边距-顶部:15px\”& gt
& ltsource src = \ & # 8221/项目名称/上传/视频_ 1509549323159.mp4 \ ”type = \ & # 8221视频/MP4 \ ”/>
& lt/video >
& lt/div >
& lt脚本类型= \ ”text/JavaScript \ ”& gt
var my video = document . getelementbyid(\ ”视频1 \ ”);
//播放暂停
函数playPause()
{
if (myVideo.paused)
my video . play()；
其他
my video . pause()；
}
//视频放大
函数***keBig()
{
myVideo.width = 560
}
//视频中等
函数***keS***ll()
{
myVideo.width = 320
}
//视频缩小
函数***keNor***l()
{
myVideo.width = 420
}
& lt/script >
& lt/body >
& lt/html >
达到的效果:
PS:注意那个src地址:一定在项目里。如果是电脑里的绝对路径，那就不行。新手上路，希望大家多多支持多多关注，也希望你能在头条的道路上越走越远。
本文来自倾心之夏投稿，不代表舒华文档立场，如若转载，请注明出处：https://www.chinashuhua.cn/24/525867.html
微信扫一扫 
