网页 视频作为背景(解决google浏览器无法访问本地资源的问题)

来源:互联网 发布:java中的注解怎么用 编辑:程序博客网 时间:2024/05/21 07:09

具体的教程是我在google上找到的:
教程:http://sighingnow.github.io/web-tech/web_video_background.html
这里我只做一个具体的实现和说明一下在具体操作中出现的bug:

Not allowed to load local resource

<!DOCTYPE HTML><html><head>    <meta charset="utf-8">    <title>使用视频作为网页背景</title>    <style type="text/css">        video#bgvid {            position: fixed; right: 0; bottom: 0;            min-width: 100%; min-height: 100%;            width: auto; height: 90%; z-index: -100;            /*background: url(G:\javaweb\前端\bideo.js-master\20140906061602621.jpg) no-repeat;*/            background-size: 80px 60px;        }        #polina {            font-family: Agenda-Light, Agenda Light, Agenda, Arial Narrow, sans-serif;            font-weight: 100;            background: rgba(0,0,0,0.3);            color: white;            padding: 2rem;            width: 33%;            margin: 2rem;            float: right;            font-size: 1.2rem;        }    </style></head><body><video autoplay loop poster="20140906061602621.jpg" id="bgvid"><source src="night.mp4" type="video/mp4"></video><div id="polina">    <h1>POLINA</h1>    <p>filmed by Alexander Wagner 2011</p></div></body></html>

这个作为一个静态页面在本地访问直接打开相应的html即可,但当我把它放在项目中的时候就出现了无法访问本地资源的bug:

Not allowed to load local resource

之后查找后发现是因为google浏览器为了安全考虑而设置的,所以为了可以成功访问我又在项目的xml中配置了相应的路径:
这里写图片描述
之后路径就改为:
这里写图片描述

basePath的配置是在html头加入:

<!DOCTYPE html>**<%    String path = request.getContextPath();    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()            + path + "/";%>**<html lang="en" class="no-js"><head>

这样以后google就不是直接访问本地资源了,这样一来就可以在项目页面播放视频啦~~~:
这里写图片描述

阅读全文
0 0