如何在弹出窗口出现和消失后延迟显示背景

Question

我希望在页面加载后显示弹出窗口。我已经使弹出窗口一切正常，但有一个问题页面在弹出窗口之前仅显示一瞬间。我希望弹出窗口先加载而不显示页面。

这是页面 http://test2429d.vinnugrunnur.is/home 的 link 弹出窗口有视频运行 7 秒然后消失。

Answer 1

查看您的sample site，您将不得不隐藏内容并在隐藏弹出窗口时取消隐藏。

原因是您的弹出窗口是使用 Javascript 动态添加的。因此在页面完全加载之前不会显示弹出窗口。

有几种方法可以做到这一点。如果此弹出窗口仅限于此页面，您或许可以使用正文 class 作为参考来隐藏您的 .jupiterx-site.

body.elementor-page-10 .jupiterx-site {
    display: none;
}

你的 Javascript 应该会在 7 秒后取消隐藏它[=14=]

jQuery(document).ready(function(){
      // setTimeout() function will be fired after page is loaded
      // it will wait for 5 sec. and then will fire
      // $("#successMessage").hide() function
  setTimeout(function() {
    jQuery('.eael-lightbox-popup-window').fadeOut('slow');
    jQuery('.jupiterx-site').show();
  }, 7000); 
});

如何在弹出窗口出现和消失后延迟显示背景

How to delay background to show after the popup appear and disappear

javascript

jquery

popup