多个视差视频背景 [英] Multiple parallax video backgrounds

问题描述

我在stackoverflow上找到了有关如何创建具有视差效果的视频div的答案 推荐的插件为: https://github.com/linnett/backgroundVideo

I found answers here on stackoverflow on how to create video div with parallax effect The recommended plugin was: https://github.com/linnett/backgroundVideo

但是，我在一个站点上需要多个视差背景，但我遇到了麻烦，第一个按顺序排列是可以的，但是其他的排列错了，不能按预期的那样工作

However I need multiple of parallax backgrounds on one site and I am having trouble with that, first one in order is allright, but the others are misspositioned, dont work absolutely as you would expect

对此有什么解决方案?分别为每个背景调用同一个插件? 我该怎么办?

What is a solution for this? Calling the same plugin for every background separately? How do I do that?

这不太有效:

<script>
  $(document).ready(function() {
    $("#my-video").backgroundVideo();
    $("#my-video2").backgroundVideo();
  });
</script>

这是视频元素的HTML:

This is HTML of video element:

<div id="video-wrap" style="height: 300px;">
  <video id="my-video" preload="metadata" autoplay loop>
    <source src="blahblah/video/video1.mp4" type="video/mp4">
  </video>
</div>

推荐答案

该插件已更新，可以播放多个视频，请检查示例用法: https://github.com/linnett/backgroundVideo

The plugin has been updated to allow for multiple videos, check the example use: https://github.com/linnett/backgroundVideo

这篇关于多个视差视频背景的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！