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

Question

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

这是页面http://test2429d.vinnugrunnur.is/home的链接，弹出窗口中的视频持续7秒钟，然后消失。

Answer 1

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

使用Javascript动态添加弹出窗口的原因。因此，直到页面完全加载后，弹出窗口才会显示。

有几种方法可以做到这一点。如果此弹出窗口仅限于此页面，则可以将body类用作隐藏.jupiterx-site的引用。

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

您的Javascript应该在7秒后取消隐藏

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); 
});