<!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. Python并发编程一（多进程）

    1.背景知识(进程.多道技术) 顾名思义,进程即正在执行的一个过程.进程是对正在运行程序的一个抽象. 进程的概念起源于操作系统,是操作系统最核心的概念,也是操作系统提供的最古老也是最重要的抽象概念之一 ...

  2. Python下的opencv小问题大智慧

    1.今晚日了狗了,图像显示不按照预期出现,然后突然就好了...... 2.根据第一个问题举一个例子,另一个我没保存... 是不是分不清楚????   plt.imshow(wjy2, cmap='gr ...

  3. oracle的schema的含义

    转自:http://www.cnblogs.com/sfmjp/articles/2932748.html 在现在做的Kraft Catalyst 项目中,Cransoft其中有一个功能就是schem ...

  4. [Android]Android布局优化之<include />

    转载请标明:转载于http://www.cnblogs.com/Liuyt-61/p/6602891.html -------------------------------------------- ...

  5. MYSQL 优化常用方法(转载)

    1.选取最适用的字段属性 MySQL可以很好的支持大数据量的存取,但是一般说来,数据库中的表越小,在它上面执行的查询也就会越快.因此,在创建表的时候,为了获得更好的性能,我们可以将表中字段的宽度设得尽 ...

  6. GitHub使用指南之快速入门

    出自http://blog.csdn.net/column/details/13170.html 1.Git安装 Git是一个版本控制系统,使用之前必须先下载安装,下面提供各平台的安装方式. Mac: ...

  7. 白鹭引擎 - 显示对象与 HelloWord ( 绘制了一个红蓝相间的 2 x 2 格子 )

    1: 白鹭引擎默认实在一个 640 * 1136 的画布上作画 2: 入口文件 Main.ts,  类 Main 是程序的入口 // 1, 在一个宽高为 640 * 1136 的画布上作画 // 2, ...

  8. 选择、操作web元素

    11月1日 什么是web元素 Selenium自动化主要就是:选择界面元素,操作界面元素(输入操作:点击.输入文字.拖拽等,输出操作:获取元素的各种属性),根据界面上获取的数据进行分析和处理 选择元素 ...

  9. pycharm 直接删掉数据表之后,makemigration和migrate 之后,数据库中依然没有生成数据表的问题

    综合分析一下行程这个问题的原因: 在终端中运行 select * from django_migrations; 查看 提交的记录,如果你的表删掉了,记录还在,那么数据库会觉得,这个表依然是存在的,所 ...

  10. 打包制作 ANE

    一.打包ANE 1.ios 准备文件: anePackager.bat aneswc.swc extension.xml flashAne.ane ioslib.a library.swf platf ...