Всплывающее модальное окно в определенные час.

[sheneman]

Доброго времени суток!
Подскажите, как вызвать модальное окно автоматически в определенный промежуток времени.
Нужно в ночные часы с 21:00 до 6:00 выкидывать новым пользователям модальное окно. Есть какие-то готовые примеры у кого?
Или подскажите как реализовать?
Окно должно всплывать у каждого уникального пользователя, с 21:00 до 6:00

[kostyanet]

По таймеру ясень пень. Попробуйте еще уведомления. Как я понял юзеры лояльны, значит разрешает уведомлять их. Это будет выглядеть так: кнопка браузера в таскбаре начинает мигать, если свернут, а если развернут то сразу появится мессага в оконце.

Скрипт может проверять если уведомления не поддерживаются, то выкатит див с мессагой.

Время - берется время на сервере и на клиенте, вычитается, получается смещение - на случай если у клиента часы барахлят. Это смещение учитывается. Остальное все просто setTimeout(func,time) и ждитё.

[kostyanet]

А, блин, в смысле юзер зашел после 21 и его наградили оконцем? Ну а в чем там вообще проблема тогда?

[sheneman]

kostyanet, Проблема в незнание JavaScript.
Я обычно копирую готовые примеры и допиливаю по справочникам. А тут как-то и примеров не нашел. Потому обратился на форум. как мне реализовать этот скрип?

[Decode]

var now = new Date(),
	start = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 21),
	end = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 06);

if ( now >= start && now <= end ) {
	if(localStorage.getItem("check") == null) showModal();
}

function showModal() {
	localStorage.setItem("check", true);
	alert("Привет, я модальное окно!");
}

[vladchv]

Привет всем. Данная тема очень актуальна, но я так к сожалению и не понял как внедрить это все в имеющийся скрипт. Буду очень благодарен, если поможете. Скрипт окна:

$(document).ready(function() {
	$('a#go').click( function(event){
		event.preventDefault();
		$('#overlay').fadeIn(400,
		 	function(){
				$('#modal_form') 
					.css('display', 'block')
					.animate({opacity: 1, top: '50%'}, 200);
		});
	});
	$('#modal_close, #overlay').click( function(){
		$('#modal_form')
			.animate({opacity: 0, top: '45%'}, 200,
				function(){
					$(this).css('display', 'none');
					$('#overlay').fadeOut(400);
				}
			);
	});
});

[рони]

vladchv,

[vladchv]

???) Это что значит?) Мб с этим ПопАпом не возможно?

[рони]

vladchv,
что хотите сделать? с чем у вас проблема? где html и css?

[vladchv]

Хочю чтобы вот этот попап всплывал только с 7 вечера до 9 утра)) В начале поста выложили решение вроде, но я не знаю как его внедрить конкретно к данному коду.

<div id="modal_form">
      <span id="modal_close">X</span>
	  <form id="form" class="phone_form">
<p id="modal1Title">Заказать обратный звонок</p>
        <div class="f-b user_phone"><p>Тел.:</p><input id="telephone-1" autocomplete="off" name="phone" type="tel" class="putPhone rfield" placeholder="(___) ___ __ __" required></div>
		<div class="f-b"><p>Ваше имя:</p><input autocomplete="off" type="text" class="putName" name="name" placeholder="..." required></div>
        <input type="submit" name="submit" class="btn" value="Отправить заявку">
    </form>
</div>
<div id="overlay"></div>

$(document).ready(function() {
	$('a#go').click( function(event){
		event.preventDefault();
		$('#overlay').fadeIn(400,
		 	function(){
				$('#modal_form') 
					.css('display', 'block')
					.animate({opacity: 1, top: '50%'}, 200);
		});
	});
	$('#modal_close, #overlay').click( function(){
		$('#modal_form')
			.animate({opacity: 0, top: '45%'}, 200,
				function(){
					$(this).css('display', 'none');
					$('#overlay').fadeOut(400);
				}
			);
	});
});