Javascript 使用jQuery打开多个视频嵌入模块

我尝试在webflow中使用jQuery创建多个模态，现在我只能够创建一个模态，如果我重复代码，它只是彼此重叠

我有8个链接图片，可以打开8个不同的模式窗口，每个窗口都包含youtube上的嵌入视频，然后关闭它们，就像现在它还在后台播放一样。我正在使用webflow.com js处理这个问题一周了，这对js来说是新的，但是由于这个原因，表单开始研究它，我的大脑受伤了：）。请帮忙

以下是html标记：

<div class="w-section modal-bg">
    <div class="w-clearfix modalw"><a href="#" class="close-modal">X</a>
      <div class="w-embed w-iframe">
        <iframe height="498" width="510" src="http://video1" frameborder="0" allowfullscreen=""></iframe>
      </div>
    </div>
  </div>

<div class="w-section modal-bg1">
    <div class="w-clearfix modalw"><a href="#" class="close-modal">X</a>
      <div class="w-embed w-iframe">
        <iframe height="498" width="510" src="http://video2" frameborder="0" allowfullscreen=""></iframe>
      </div>
    </div>
  </div>

jQuery代码：

$(document).ready(function() {
  $('.modal-link').click(function() {
    $('.modal-bg').fadeIn();
  });
  $('.close-modal').click(function() {
    $('.modal-bg').fadeOut();
  });
});

---

您是否尝试过使用

.toggle（）

方法？ 像这样：

$(document).ready(function() {
  $('.modal-link').click(function() {
    $('.modal-bg').toggle();
  });
  $('.close-modal').click(function() {
    $('.modal-bg').toggle();
  });
});

您还可以指定切换的持续时间，如

.toggle（400）

，其中指定的数字以毫秒为单位，以模拟

.fadeIn（）/.fadeOut（）

---

更多信息。

您是否尝试过使用

.toggle（）

方法？ 像这样：

$(document).ready(function() {
  $('.modal-link').click(function() {
    $('.modal-bg').toggle();
  });
  $('.close-modal').click(function() {
    $('.modal-bg').toggle();
  });
});

您还可以指定切换的持续时间，如

.toggle（400）

，其中指定的数字以毫秒为单位，以模拟

.fadeIn（）/.fadeOut（）

---

更多信息。

谢谢！！昨天读过，但没有看到如何在我的情况下实施，再次感谢！！很乐意帮忙。如果你不介意的话，你能把我的回答标记为回答你的问题吗？谢谢！！昨天读过，但没有看到如何在我的情况下实施，再次感谢！！很乐意帮忙。如果你不介意的话，你能把我的回答标记为回答你的问题吗？