gpt4 book ai didi

javascript - 无法在 Rails 应用程序中使用 BigVideo.js 插件在视频背景前面显示文本

转载 作者:行者123 更新时间:2023-12-03 11:48:00 26 4
gpt4 key购买 nike

我正在开发一个 Rails 应用程序,我想使用 BigVideo.js 渲染视频背景。但是,我只能让视频显示在其他所有内容的前面,因此它违背了作为背景的目的。

这是我的代码:

布局/application.html.erb:

<!DOCTYPE html>
<html>
<head>
<title>MyApp</title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link href="//vjs.zencdn.net/4.7/video-js.css" rel="stylesheet">
<script src="//vjs.zencdn.net/4.7/video.js"></script>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
</head>
<body>

<%= yield %>

</body>
</html>

Assets /javascripts/static.js:

$(document).ready(function() {
var BV = new $.BigVideo({container: $('.wrapper')});
BV.init();
BV.show('http://vjs.zencdn.net/v/oceans.mp4',{ambient:true});
});

views/static/index.html.erb:

<div class="container">
<div class='jumbotron'>
<h2 class='center-text'>I'd like to show up in front of the video</h2>
<div class="wrapper"></div>

<div class="text-center">
<a class='btn btn-primary btn-lg' role='button'>Learn More</a>
</div>
</div>
</div>

我非常感谢任何帮助或指示!谢谢!

最佳答案

看起来我没有在视频背景上设置 z-index。一旦我将 z-index 设置为 -1,它就起作用了。

关于javascript - 无法在 Rails 应用程序中使用 BigVideo.js 插件在视频背景前面显示文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25963466/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com