Question

我试图让特定的div拥有视频背景但它做得不对。这是我正在处理的页面： http://videotest-2.businesscatalyst.com/sample.html

视频显示在#container中，我希望它在#wrapper

中

这是我的代码：使用Tubular插件

<style type="text/css">
body,html { margin:0; padding::0;}
#container {
background-color: #000;
height:100%;
min-height:50% !important;
width:100&;
position:relative;  
}
#wrapper {
opacity:75%;
height:500px;   
background-color:#FF5A5D;
}
</style>
</head>
<body>
<section id="container">
<div id="wrapper">Top section- I need a youtube video background here</div>
</section>
<script src="https://code.jquery.com/jquery.js"></script>
<script src="js/jquery.tubular.1.0.js"></script>
<script src="js/custom.js"></script>

</body>
</html>

你们知道这似乎是什么问题吗？

提前感谢！

Answer 1

请参阅js / jquery.tubular.1.0.js中的第45行：

$body.prepend(tubularContainer);

基本上，这段代码表示视频只会添加到您的身体顶部。如果你想在#wrapper中使用它，请尝试将此行编辑为。

$("#wrapper").append(tubularContainer);

Answer 2

CSS：

 .body {
}
.videobackground {
 margin: auto;
 background-color: black;
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 margin: 0px;
}

HTML：

<head>
    <link rel="stylesheet" href="css/css.css">
</head>
<body class="videobackground">
  <video class="videobackground" id="videobackground" preload="" muted=""controls="" poster="" >
   <source src="videos/film2.mp4" type="video/mp4" />
   <source src="videos/film2.3gpp" type="video/3gpp" />
  </video>
  </body>

如何在特定div内进行视频显示？

2 个答案: