HTML5培训学习音频、视频播放功能

2017-06-20 14:37:00

关于HTML5中的音频、视频播放功能
 
1、音频播放
HTML5 规定了一种通过 audio 元素来包含音频的标准方法。Audio元素可以播放音频文件或者音频流。
语法:

解释:音频文件可以是多种格式的。Audio标签有多种属性,如下所示
属性
描述
autoplay
autoplay
音频就绪,马上播放
controls
controls
显示控件,如播放按钮
loop
loop
音频重复播放
muted
muted
规定该音频输出默认为静音
preload
preload
音频在页面加载时进行加载,并预备播放
src
url
需要播放音频的URL
 
实例:













 

运行程序,用autoplay属性立刻播放音乐,但用muted属性控制默认为静音状态,controls用来播放器控件,loop设置歌曲循环播放。
 
2、视频播放
语法:

解释:HTML5中用video标签定义视频的播放,video的属性如下表。
 
属性
描述
autoplay
autoplay
视频就绪后马上播放
controls
controls
向用户显示控件
loop
loop
设置循环播放
muted
muted
设定音频输出为静音
poster
URL
视频加载前显示的图像
preload
preload
视频在页面加载时进行加载
src
url
要播放视频的地址
width
pixels
设置视频播放的宽度
height
pixels
设置视频播放的高度
 
实例:














运行代码,如图效果,设置播放器宽度500像素,高度300像素。使用poster属性设置,在点击视频播放前显示网络上的一张图片,播放后图片消失。

iOS QQ群

HTML5 QQ群

飞雀动态

行业新闻

Copyright © 2015-2016 Future education technology co., LTD All Rights Reserved