Хочу сделать PopUp с определенным интервалом, т.е. при открытии страницы появляется PopUp, нажал на крестик, через время опять появился PopUp.
Например, magnificPopUp только при клике:
$(document).ready(function(){
$('.popup-link').magnificPopup();
});
Kак сделать его, чтобы PopUp через время сам появлялся?
SetInterval - Запускает выполнение функции регулярно повторяет её через указанный интервал времени.
Задержка в миллисекундах, 1000 миллисекунд равны 1 секунде.
Magnific-popup documentation
$.magnificPopup.open
- Открыть окно напрямую через API
$.magnificPopup.close
- Закрыть всплывающее окно.
$(document).ready(function(){
setInterval(function() {
console.log( "тик" );
$('.popup-link').magnificPopup();
}, 1000);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js"></script>
Update "Open magnific"
$(document).ready(function(){
setInterval(function() {
jQuery.magnificPopup.open({
items: {src: '.popup-link'},
type: 'inline'
});
magnificPopupClose();
}, 2000);
function magnificPopupClose(){
setTimeout(function(){
$.magnificPopup.close();
}, 1000);
}
});
*{
color: white;
text-align:center;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.min.css" rel="stylesheet">
<div class="popup-link">Контент</div>
$(document).ready(function(){
setTimeout(function(){ // открывается через секунды после загрузки страницы можно удалить строку если надо открытие сразу
$.magnificPopup.open({
items: {src: '.popup'},
type: 'inline',
callbacks: {
close: function() { // как только первый раз закрыли ставим счетчик
setTimeout(function(){ // открытие второй раз через 10 секунд после закрытия первого
$.magnificPopup.open({
items: {src: '.popup'},
type: 'inline',
callbacks: { // колбэк чтобы удалить второе предложение из попапа, чисто для наглядности примера, можно удалить
open: function() {
$('.popup').text('Кликните по фону для закрытия.');
},
}
});
}, 10000); // 10 секунд
}
}
});
}, 1000); // 1 секунда задержки, можно удалить строку если надо открытие сразу
});
* {
color: white;
text-align:center;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.min.css" rel="stylesheet">
<div class="popup">Кликните по фону для закрытия. <br/>Через 10 секунд откроется повторно.</div>
Виртуальный выделенный сервер (VDS) становится отличным выбором
Проблема в том, что длинные цитаты обрываются на 66м знакеВообще нет догадок, что может оказаться причиной
Подскажите, в чем кардинально разнится Nunjucks в сравнении с ninja2 ? Можно синтаксически впилить код написанный на ninja2 в код с проектом на Nunjucks?
подскажите пожалуйста, если я на какой-то объект подвесил событие