• HTML5 Video与Audio 视频与音频


    ---- 视频Video对象

    - 指定视频播放地址

    <video width="320" height="240" controls="controls">
       <source src="movie.ogg" type="video/ogg" />
       <source src="movie.mp4" type="video/mp4" />
       你的浏览器不支持视频标签
    </video>

    - 内嵌元素,若不支持将会显示那些指定的文字

    - 视频额外属性

    属性 描述
    ------------------------------------------------------------
    poster 在视频加载完成之前,代表视频内容的图片的URL地址
    width,heigth 设置显示尺寸
    videoWidth,videoHeight 返回视频的固有或自适应的宽度和高度,只读

    ---- 格式与浏览器匹配

    Codec Firefox Opera Chrome Safari IE IOS* Android
    --------------------------------------------------------------------
    OGG 3.5 10.50 3.0
    MP4 3.0 3.0 2.0
    WebM 4.0 10.60 6.0 9**
    Flash Plug-In Plug-In Plug-In Plug-In Plug-In 2.2

    ---- 音频Audio对象

    - 与视频同享 HTMLMediaElement
    - var audio = new Audio(src);

    (注意:以前Audio和Vidio都通用)

    - 常用的控制函数

    函数 动作
    ------------------------
    load() 加载音频/视频文件,为播放做准备.通常情况下不必调用,除非是动态生成的元素,用来在播放前预加载
    play() 加载并播放音频/视频文件,除非音频/视频已经暂停在其他位置了,否则默认从开头播放
    pause() 暂停处理播放状态的音频/视频文件
    canPlayType(type) 测试void元素是否支持给定MIME类型的文件

    - 只读的媒体属性

    属性 描述
    -------------------------
    duration 整个媒体文件的播放时长,以s为单位,如果无法获取时,则返回NaN
    paused 如果媒体文件当前被暂停,则返回true,如果还未开始播放,默认返回true
    ended 如果媒体文件已经播放完毕,则返回true
    startTime 返回最早的播放起始时间,一般是0.0,除非是缓冲过的媒体文件,并且一部分内容已经不在缓冲区
    error 在发生了错误的情况下返回的错误代码
    currentSrc 以字符串形式返回当前正在播放或已加载的文件,对应于浏览器在source元素中选择的文件

    - 可脚本控制的值

    属性 描述
    -------------------------
    autoplay 是否自动播放,或者查询是否已设置为autoplay
    loop 是否循环播放
    currentTime 以s为单位返回从开始播放到现在所用的时间,在播放过程中,设置currentTime来定位媒体快进/快退
    controls 显示或隐藏用户控制界面,或者查询用户控制界面是否可见
    volume 在0.0到1.0之间设置音频音量的相对值,或者查询当前音量值
    muted 设置静音,或检测是否为静音
    autobuffer 播放前是否进行缓冲加载,如果媒体已设置autoplay,则忽略此特性

  • 相关阅读:
    UESTC--1727
    css3制作左右拉伸动画菜单
    Mysql主从数据库(master/slave),实现读写分离
    阿里云Centos7.6上面部署基于redis的分布式爬虫scrapy-redis将任务队列push进redis
    利用基于Go Lang的Hugo配合nginx来打造属于自己的纯静态博客系统
    Centos7.6上利用docker搭建Jenkins来自动化部署Django项目
    使用基于Vue.js和Hbuilder的混合模式移动开发打造属于自己的移动app
    Centos7.6上部署Supervisor来监控和操作各类服务
    Centos上配置nginx+uwsgi+负载均衡配置
    Websocket---认识篇
  • 原文地址:https://www.cnblogs.com/xgao/p/4200695.html
Copyright © 2020-2023  润新知