一:视频播放

传统的视频音频播放是通过flash插件的形式完成,不是所有的浏览器都安装了flash插件,而且手机端不支持flash,这就导致视频和音频的播放会有很大的麻烦。

于是,HTML5增加音频和视频标签。

controls:添加控制面板

loop:设置循环播放

poster="":添加海报

preload:预加载

autoplay:视频自动播放

因为版权的缘故,同一个视频不可能得到所有浏览器的支持。所以引入了source标签,写在video,可以书写多个,浏览器会从上往下依次判断第一能播放的格式。

video向JS提供了几个API’

方法:

play()    播放

pause()  暂停

属性:

paused   判断视频是否处于暂停状态。如果是暂停状态,返回true;否则,返回false

currentTime  返回视频播放的当前位置

duration   返回视频的总长

playbackRate  返回视频的当前速度,1表示正常速度

muted    如果设置为true,表示静音;否则,是不静音的

volume   表示视频的音量,最大为1,最小为0

代码:

二:音频播放

音频标签是audio

controls   显示控制面板

loop      允许循环播放

preload   预加载

autoplay   自动播放(当添加了autoplay的时候, preload是自动失效)

给音频添加控制面板

允许音频循环播放

让音频预加载

允许音频自动播放

由于版权的问题,没有一个格式是所有浏览器都支持的,所以我们需要加source标签。浏览器从上往下依次判断source的格式,找出第一个支持的格式进行播放。

最新文章

  1. 数据库表被锁表,select会等待。
  2. 流量分析 seo alexa 排名
  3. 在线调试js工具网站
  4. Teamwork——Week 4 Daily Scrum Meeting#1 2013.10.23
  5. h5-2
  6. C语言中的malloc和free
  7. js中this的指向
  8. Java系列--第四篇 基于Maven的SSME之发送邮件
  9. 【详细资料】ICN6211:MIPI DSI转RGB芯片简介
  10. mybatis实战教程三:多对多关联
  11. Android OkHttp Get请求方式
  12. EXT.NET初学
  13. HNOI2017 抛硬币 (FakeBeng)
  14. Yii2给数据库表添加字段后对应模型无法识别到该属性的原因和解决办法
  15. N76E003的定时器/计数器 0和1
  16. $ cd `dirname $0` 和PWD用法
  17. gcc5.2版本安装详解
  18. macos安装postman
  19. oracle 父子关系
  20. 七、如何在Java中高效检查一个数组是否含有一个值

热门文章

  1. React 教程
  2. 6.安装pyhook报错is not a supported wheel on this platform
  3. scRNA-seq测序的两种技术[转载]
  4. sysbench压测mysql基本步骤
  5. Linux Makefile
  6. MySQL测试工具之-tpcc
  7. P3327/bzoj3994 [SDOI2015]约数个数和(莫比乌斯反演)
  8. 20145211MSF基础应用实验
  9. LCD1602小程序
  10. HDU 1438 钥匙计数之一(状压DP)题解