<!DOCTYPE html>
<html>
<head>
   <title>Operation Aborted Example</title>
    <style>
        body{
            margin: 0;
        }
        #video{
            position:fixed;
            right: 0;
            bottom: 0;
            min-width: 100%;
            min-height: 100%;
            width: auto;
            height: auto;
            z-index: -1;
            -webkit-filter:grayscale(100%);
        }
    </style>
</head>
<body>

<div id="div">
    <video id="video" muted src="VID.mp4" autoplay loop>您的浏览器不支持\&lt; video&gt;元素</video>
</div>

<<script>
    var video= document.getElementById('video');
    video.playbackRate = 0.5;
</script>

</body>
</html>

HTML5将<video>视频设置为页面动态背景的更多相关文章

  1. 【HTML5】video视频

    当前,video 元素支持三种视频格式: 格式 IE Firefox Opera Chrome Safari Ogg No 3.5+ 10.5+ 5.0+ No MPEG 4 9.0+ No No 5 ...

  2. html5开发<video>视频字幕的程序

    <!DOCTYPE html> <html lang="en"> <head>     <meta charset="utf-8 ...

  3. HTML5添加 video 视频标签后仍然无法播放的解决方法 IIS添加MIEI类型

    现象:插入如下代码后仍然无法看视频(注:视频已确认为浏览器支持格式) <video controls="controls" width="500px" h ...

  4. HTML5 Video(视频)

    HTML5 Video(视频) 很多站点都会使用到视频. HTML5 提供了展示视频的标准. 检测您的浏览器是否支持 HTML5 视频: 检测 Web站点上的视频 直到现在,仍然不存在一项旨在网页上显 ...

  5. html5 音频和视频（audio And video）

    1.音频和视频  Web 上的视频 直到现在,仍然不存在一项旨在网页上显示视频的标准. 今天,大多数视频是通过插件(比如 Flash)来显示的.然而,并非所有浏览器都拥有同样的插件. HTML5 规定 ...

  6. HTML5: HTML5 Video(视频)

    ylbtech-HTML5: HTML5 Video(视频) 1.返回顶部 1. HTML5 Video(视频) 很多站点都会使用到视频. HTML5 提供了展示视频的标准. 检测您的浏览器是否支持 ...

  7. js控制html5 【video】标签中视频的播放和停止

    需求:页面中有2个普通按钮a,b.还有一个video标签,能成功播放出视频..我想要的效果是,点击a按钮,视频开始播放,点击b按钮,视频播放停止!!!<br><br>----- ...

  8. 在使用html5的video标签播放视频时为何只有声音却没有图像

    在使用html5的video标签播放视频时为何只有声音却没有图像? 答:使用格式化工厂转个编码就行了,MP4有3种编码,mpg4(xdiv),,mpg4(xvid),avc(h264)转换成H264编 ...

  9. The jQuery HTML5 Audio / Video Library (jQuery jPlayer插件给你的站点增加视频和音频功能)

    http://jplayer.org/ The jQuery HTML5 Audio / Video Library jPlayer is the completely free and open s ...

随机推荐

  1. call与apply简单介绍

    var pet={ word:'...', speak:function(say){ console.log(say+' '+this.word) } } //pet.speak('speak')// ...

  2. cdlinux写入u盘启动的制作教程

    制作方法如下:(摘自于https://blog.csdn.net/suquan629/article/details/52996792) 1.所需要的工具软件: cdlinux0.9.7.isoUlt ...

  3. Linux的用户

    添加用户 添加删除用户 # useradd user # passwd user Changing password for user user. New password: BAD PASSWORD ...

  4. 5、申请开发(Development)描述文件

    申请开发(Development)描述文件 在“Certificates, Identifiers & Profiles”页面“Provisioning Profiles”下选择“Develo ...

  5. System.Data.DbType映射关系

    有如下类型的映射对照: System.Data.SqlClient.SqlDbType  System.Data.OleDb.OleDbType System.Data.Odbc.OdbcType S ...

  6. ROS学习手记 - 2.1: Create and Build ROS Package 生成包（Python）

    ROS学习手记 - 2.1: Create and Build ROS Package 生成包(Python) 时隔1年,再回来总结这个问题,因为它是ros+python开发中,太常用的一个操作,需要 ...

  7. 【其他】SAS key 获得办法【转载】

    小弟偶然得到了一个利用google得到SID的方法,经本人测试(9.4 64位)得到的SID可以用到2015年12月,从此之后再也不用改时间了.为了让更多的人看见,设定了回复可见.所有内容免费.路过的 ...

  8. for循环、in、not in

    for循环可以遍历集合中任意一个元素 1 a = ["hello", "world", "dlrb"] 2 for b in a: 3 pr ...

  9. DataBinding（二）：DataBinding的基本用法

    转自:DataBinding系列(二):DataBinding的基本用法 1.在xml中引入一些基础变量Variables data 标签中可以有任意数量的 variable 标签.这些变量可以使Ja ...

  10. 使用include重用布局

    尽管Android 支持各种小部件,来提供小且可以重用的交互元素,你可能还需要更大的,要求一个专门布局的重用组件.为了高效的重用整个布局,你能使用和标签在当前的布局中嵌入别的布局. 重用布局功能特别强 ...