zoukankan      html  css  js  c++  java
  • HTML5--关于音频和视频

     * 音视频处理

       * 视频处理

         * 基本内容

           * 使用Flash技术处理HTML页面中的视频内容

             * 包含音频、动画、网页游戏等

            * 特点

              * 浏览器原生不支持(IE浏览器要求安装ActiveX组件)

              * 性能不好(不能过多地使用)

              * 智能移动端并不支持Flash技术

            * 命运

              * Flash的母公司Adobe公开宣布放弃

           * 目前用于替代Flash技术最好的选择 - HTML5

             * 几乎所有浏览器原生支持<video>元素

            * 性能更高

            * 智能移动端支持非常好

         * 如何实现视频处理

           * <video>元素

             * 如果当前浏览器不支持<video>元素

              * 在<video>元素内编写提示内容

            * 属性

              * src - 引入视频文件的路径

              * autoplay - 自动播放视频

           * 使用<source>元素

             <video>

               <source src="一种视频格式" />

               <source src="一种视频格式" />

               <source src="一种视频格式" />

            </video>

         * <video>支持的视频格式

           * MP4格式 - 目前比较主流

           * OGG格式 - 多用于移动端

           * WebM格式 - 目前唯一支持超高清格式

             * 在HTML页面中支持超高清格式(HTML5)

            * 由Google公司推出的

         * <video>元素的属性

           * src - 引入视频文件的路径

           * autoplay - 自动播放视频

           * controls - 提供控制面板

           * loop - 表示循环播放

           * poster - 设置播放之前显示的图片

           * width和height - 设置显示视频的宽度和高度

           * preload - 预加载

             * auto - (默认值)自动加载

            * none - 不加载

            * metadata - 只加载视频的基本信息(不含视频)

         * 高级内容

           * 方法

             * play() - 播放视频

            * pause() - 暂停视频

            * load() - 加载视频

            * canPlayType() - 判断当前浏览器是否支持指定视频格式

           * 事件

             * play - 当视频播放时被触发

            * pause - 当视频暂停时被触发

            * ended - 当视频结束时被触发

            * error - 当视频错误时被触发

            * canplay - 不考虑整体情况下,只要能播放,就播放

            * canplaythrough - 考虑整体情况下,只要能播放,就播放

            * progress - 表示视频加载的进度

           * 属性 - 用于判断

             * paused - 表示判断当前视频是否暂停

              * 返回Boolean值,true表示暂停,false表示播放

            * ended - 表示判断当前视频是否播放完毕

              * 返回Boolean值,true表示完毕

            * duration - 表示当前视频的时长

            * currentTime - 表示当前视频播放的位置

       * 音频处理

     *

     * 扩展内容

       * Web前端 - 移动端

         * 移动智能终端

           * iPhone - IOS系统 - Object-c|Swfit

           * Android系统 - Java

           * Windows Mobile系统 - .net平台

           * BlackBerry系统 - 企业级应用 QNX

           * WebOS系统 - 全键盘+触摸屏

           * 塞班 - 诺基亚

           * MeeGo - Inter和诺基亚

         * 移动跨平台 - HTML|CSS|JAVASCRIPT

           * 一次编写,到处运行(phoneGap)

       *

  • 相关阅读:
    爬虫学习
    微软命令行安装第三方库
    Python复习(拾遗)3
    Python拾遗2
    Python复习(拾遗)
    python练习 自动绘图
    多分支结构
    turtle
    Python练习
    随便写点…
  • 原文地址:https://www.cnblogs.com/baiyanfeng/p/5042886.html
Copyright © 2011-2022 走看看