• video标签


    video

    通过video标签,我们可以抛弃最近不怎么讨好的Flash,直接在页面中播放视频文件。视频文件自然是最符合语义化的文件格式,但该元素标签同样支持音频与图片。

    过去(及目前),我们通常要使用类似下面这样繁冗丑陋的代码来将视频放置在页面中,但这种方式要求浏览器安装有Flash插件,并支持JavaScript:

    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="425" height="344" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0">
    <param name="allowFullScreen" value="true" />
    <param name="allowscriptaccess" value="always" />
    <param name="src" value="http://www.youtube.com/v/oHg5SJYRHA0&hl=en&fs=1&" />
    <param name="allowfullscreen" value="true" />
    <embed type="application/x-shockwave-flash" width="425" height="344"  src="http://www.youtube.com/v/oHg5SJYRHA0&hl=en&fs=1&" allowscriptaccess="always" allowfullscreen="true">
    </embed>
    </object>
    

    HTML5的方式:

    <video width="640"  height="360" src="http://www.youtube.com/demo/google_main.mp4"  controls autobuffer>
    <p>
    Try this page in Safari  4! Or you can
    <a  href="http://www.youtube.com/demo/google_main.mp4">download the  video</a>
    instead.
    </p>
    </video>
    

    video标签有如下几个常用属性:

    Autoplay: 用来设定视频是否在页面加载后自动播放。
    Src: 为视频指定文件链接或下载路径,当浏览器不支持video标签或发生某种播放错误时,可以提供给用户进行下载。
    Autobuffer: 用来设定视频是否自动缓冲;如果设定,那么页面加载之后,视频会自动下载缓冲,当用户点击播放按钮后,至少已经有一部分视频可以直接观看而无需等待了。
    Poster: 用来为视频设置一个“相框默认图片”性质的背景图片;当视频无法正常加载播放时可以向用户呈现。
    Controls: 用来设置是否为视频添加控制条,例如“播放”、“暂停”等;控制条的外观可以自定义。
    Loop: 用来设置视频是否循环播放。
    Width , Height: 用来控制视频的宽度与高度。
    虽然video元素备受关注且大有潜力,不过距离被主流浏览器全面支持仍有待时日;目前,如果一定有必要使用video标签,我们可以使用类似如下不伦不类的代码组合方式:

    <video width="640" height="360" src="http://www.youtube.com/demo/google_main.mp4" autobuffer controls poster="whale.png">
    <object classid="clsid:02bf25d5-8c17-4b23-bc80-d3488abddc6b" width="640"height="360" codebase="http://www.apple.com/qtactivex/qtplugin.cab">
    <param value="http://www.youtube.com/demo/google_main.mp4">
    <param value="true">
    <param value="false">
    <embed src="http://www.youtube.com/demo/google_main.mp4" width="640"height="360" autoplay="true" controller="false" pluginspage="http://www.apple.com/quicktime/download/">
    </embed>
    </object>
    </video>
    

    HTML5学习笔记简明版(4):新元素之video,audio,meter,datalist,keygen,output

    HTML video 标签

    HO8001: 各浏览器下使用 OBJECT 元素和 EMBED 元素嵌入 Flash 存在差异

  • 相关阅读:
    五、appium自动化之模拟点击、滑动等用户行为
    三、jMeter测试,jason Ectractor和正则表达式获取数组类型
    四、appium实现九宫格滑动和双指缩放操作--TouchAction/MultiAction
    三、定时器--强制等待、显式等待和隐式等待
    一、jMeter实现文件的上传和下载
    二、appium+python find_element定位元素的方法
    二、jMeter测试之输出测试结果到excel文件(jxl.jar)
    一、appium自动化测试--初始化设置
    fourSum
    letterCombinations
  • 原文地址:https://www.cnblogs.com/masai1969/p/4355527.html
Copyright © 2020-2023  润新知