如何使用jquery/javascript在此视频样式中向下滚动到内容框？

要实现在视频样式中向下滚动到内容框，可以使用jQuery或JavaScript来实现。下面是一个示例代码：

HTML部分：

<div class="video-container">
  <video src="video.mp4" autoplay loop muted></video>
  <div class="content">
    <!-- 内容框的内容 -->
  </div>
</div>

CSS部分：

.video-container {
  position: relative;
  height: 100vh;
  overflow: hidden;
}

.video-container video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.video-container .content {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80%;
  height: 50%;
  background: #fff;
  padding: 20px;
  text-align: center;
}

JavaScript部分：

$(document).ready(function() {
  // 监听滚动事件
  $(window).scroll(function() {
    var scrollTop = $(window).scrollTop();
    var videoHeight = $('.video-container').outerHeight();
    var contentHeight = $('.content').outerHeight();
    
    // 当滚动到视频底部时，向下滚动到内容框
    if (scrollTop >= videoHeight) {
      $('html, body').animate({
        scrollTop: videoHeight + contentHeight
      }, 500);
    }
  });
});

这段代码首先创建了一个包含视频和内容框的容器，使用CSS设置容器的样式，其中视频使用绝对定位覆盖整个容器，内容框位于视频底部。然后使用JavaScript监听滚动事件，当滚动到视频底部时，使用动画效果将页面滚动到内容框的位置。

请注意，这只是一个简单的示例代码，具体实现可能需要根据实际情况进行调整。另外，推荐的腾讯云相关产品和产品介绍链接地址需要根据具体需求和场景进行选择，可以参考腾讯云的官方文档或咨询他们的客服获取更详细的信息。