如何在彈出窗口顯示和消失后延遲顯示背景

Question

我希望一旦頁面加載就顯示彈出窗口。 我已經讓彈出窗口的一切工作正常但是有一個問題頁面在彈出窗口之前只顯示了一瞬間。 我希望首先加載彈出窗口而不顯示頁面。

這是頁面鏈接http://test2429d.vinnugrunnur.is/home popup有視頻，運行7秒鍾后消失。

Answer 1

查看您的示例站點 ，您必須隱藏內容並在隱藏彈出窗口時取消隱藏它。

彈出窗口的原因是使用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); 
});