模态弹出时暂停视频 - HTML & Javascript

Question

您好，我想在模态弹出窗口时暂停视频，我该怎么做？这是代码

这是弹出时的模式 - 我将其更改为 jumbotron 因为我更喜欢它。

<div class="overlay">
  <br><br><br><br><br><br><br><br><br><br><br>

    <div class="text-center col-md-8" style="margin-left: 250px;">

         <div class="jumbotron">
          <h1><u>THIS IS AN ANNOUNCEMENT</u></h1>
          <h1>Please read the announcement</h1>
          <h3>You are a safe passenger</h3>
          <h1><?php echo $row['id']; ?> <?php echo $row['additional_info']; ?></h1>
          <p><a class="btn btn-primary btn-lg" href="#" role="button">TAPOS NA!</a></p>
        </div>

    </div>

这里是视频源

<video oncontextmenu="return false;" src="../inflightapp/storage/app/public/movie_videos/<?php echo ''.$row2['movie_video'].''; ?>" id="noads" width="1px" controls controlsList="nodownload"> 

Answer 1

给视频添加id属性：

<video id="myVideo" ...

您可以使用 JavaScript 暂停视频。当modal弹出时调用pauseVid();函数。

<script>
var vid = document.getElementById("myVideo");

function pauseVid() { 
  vid.pause(); 
} 
</script>