Задержка закрытия окна javascript

Я работаю над окном javascript, который отображает объявления для Google DFP. Я новичок в javascript, и код, который я здесь, адаптирован из другой рекламной службы.Задержка закрытия окна javascript

Окно открывается только при загрузке страницы и закрывается при нажатии кнопки закрытия, но я бы хотел, чтобы он закрывался автоматически через определенное время (например, пять секунд).

Вот код, я использую:

<html> 
<head> 
    <style> 
    .simple_overlay { 
     display: none; 
     z-index: 10000; 
     background-color: #fff; 
     width: 640px; 
     height: 480px; 
     border: 20px solid black; 
     -moz-box-shadow: 0 0 90px 5px #000; 
     -webkit-box-shadow: 0 0 90px #000; 
    } 

    .simple_overlay .close { 
     background-image: url https://s3.amazonaws.com/onlineads/interstitial_test/CloseWindow_shoot.png); 
     position: absolute; 
     right: -35px; 
     top: -35px; 
     cursor: pointer; 
     height: 30px; 
     width: 30px; 
    } 
    .title { 
     font-weight: 20px; 
    } 
    </style> 
    <script type="text/javascript" src="https://s3.amazonaws.com/onlineads/shoot_js/jquery.min.js"></script> 
    <script type="text/javascript" src="https://s3.amazonaws.com/onlineads/shoot_js/jquery.tools.min.js"></script> 
    <script> 
     setTimeout(function() { $("#interstitial_test").overlay({top: 200,mask: { color: "black", loadSpeed: 200, opacity: 0.5}, closeOnClick: false,load: false}); 
     setTimeout(function() {$("#interstitial_test").overlay().load();},2000);},200); 
    </script> 
    <title>Intestitial Test</title> 
    </head> 

    <body> 
    <div class="simple_overlay" id="interstitial_test"> 
      <img src="https://s3.amazonaws.com/onlineads/shoot/Interstitial_Artwork.jpg"></img> 
    </div> 
    </body> 

</html>

источник

2015-01-07 Mike Morgera

Вам действительно нужно показывать рекламное окно? Я ненавижу их, там очень навязчиво. Это просто мнение. Посмотрите код для вас. – Mouser

Если вы предоставите jsFiddle, это будет проще. –

var timer = 5000; // in millisecond 

setTimeout(function() { 
    // trigger a click on the #interstitial_test after 5 seconds. 
    $('#interstitial_test').trigger('click'); 
}, timer);

Не уверен, если это то, что вы хотите или нет. Я предполагаю, что вы нажмете на элемент #interstitial_test, чтобы закрыть окно.

источник

2015-01-07 20:07:14 Xzigraz

Я пробовал таймер var и устанавливал функцию таймаута, но это, казалось, не имело никакого эффекта. Выходит ли это выше с другими функциями или под HTML? –

Это не учитывает контекст jQuery tools здесь плюс OP, похоже, знает, как использовать setTimeout – sodawillow

Спасибо, что указал мне в правильном направлении! –

Это будет использовать событие onLoad, которое обеспечивает оверлей. После того, как наложение было загружено, событие onload запускает setTimeout, который закрывает диалоговое окно.

documentation on overlay

Добавьте к вашей странице в настройках наложения

$("#interstitial_test").overlay(... onLoad : closeModalOverlay ...)

И следующие функции. Я задать время закрытия по умолчанию на 10 секунд

function closeModalOverlay() { 
    setTimeout(function() {$("#interstitial_test").overlay().close();},10000); 
}

источник

2015-01-07 20:24:39 Mouser

Субъект является недействительным, как вы говорите об окне вместо «всплывающих окон»; Я знаю, что это просто слова; но это поможет людям понять вашу проблему.

Кстати, вот мое предложение:

// Wait until DOM is ready 
 
$(function(){ 
 

 
    // This is your Element : 
 
    $overlay = $("#interstitial_test"); 
 
    
 
    // Assign the overlayJQueryStuffs 
 
    $overlay.overlay(
 
    { 
 
     top: 200, 
 
     mask: { 
 
     color: "black", 
 
     loadSpeed: 200, 
 
     opacity: 0.5 
 
     }, 
 
     closeOnClick: false, 
 
     load: false 
 
    } 
 
); 
 

 
    // Open it 
 
    $overlay.overlay().load(); 
 

 
    // Close it later : 
 
    setTimeout(
 
    function() { 
 
     $overlay.overlay().close(); 
 
    }, 
 
    2000 
 
); 
 
    
 
    
 
});

.simple_overlay { 
 
    display: none; 
 
    z-index: 10000; 
 
    background-color: #fff; 
 
    /* 
 
    width: 640px; 
 
    height: 250px; 
 
    */ 
 
    width: 64px; 
 
    height: 25px; 
 
    border: 20px solid black; 
 
    -moz-box-shadow: 0 0 90px 5px #000; 
 
    -webkit-box-shadow: 0 0 90px #000; 
 
} 
 

 
.simple_overlay .close { 
 
    background-image: url(https://s3.amazonaws.com/onlineads/interstitial_test/CloseWindow_shoot.png); 
 
    position: absolute; 
 
    right: -35px; 
 
    top: -35px; 
 
    cursor: pointer; 
 
    height: 30px; 
 
    width: 30px; 
 
} 
 

 
.title { 
 
    font-weight: 20px; 
 
}

<div class="simple_overlay" id="interstitial_test"> 
 
    <img src="https://s3.amazonaws.com/onlineads/shoot/Interstitial_Artwork.jpg"></img> 
 
    </div> 
 

 

 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="http://cdn.jquerytools.org/1.2.6/full/jquery.tools.min.js"></script>

Надеется, что это поможет. Я использовал эту документацию, чтобы узнать о накладке: http://jquerytools.github.io/documentation/overlay/

Я думаю @Mouser прав. Возможно, я не понял этого вопроса. Если вы хотите закрыть всплывающее окно x после его открытия. Вы должны включить функцию закрытия внутри события onload.

источник

2015-01-07 20:31:32

Спасибо всем за указал мне в правильном направлении (и что документация наложения.)

Ответ оказался довольно прост; Я добавил следующий код.

setTimeout('$("#interstitial_test").data("overlay").close();', 10000);

Это, кажется, работает отлично.

источник

2015-01-07 20:58:09

Это работает, потому что времени ожидания достаточно. Но более общий, просто добавляющий этот код ниже строки, которая открывает диалог, является ошибочным.Рассмотрим следующую ситуацию: у вас есть модальный диалог, который загружает данные асинхронно, ответный сервер занят, а загрузка занимает более 10 секунд. Перед загрузкой содержимого диалог будет закрыт вашим кодом. Использование события onload гарантирует, что данные контента загружаются до закрытия окна. Тем не менее я категорически не рекомендую показывать рекламу на этом пути. – Mouser

Задержка закрытия окна javascript

ответ

Смежные вопросы