Соединить два скрипта в один
Доброго времени суток!! Всех с наступившим Новым годом!!!
Есть вот такие два скрипта.Помогите пожалуйста их соединить в один и чтобы был еще крестик для закрытия. Спасибо!!! <script type="text/javascript"> setTimeout(function(){$('.web').fadeIn('fast')},10000)</script> <script type="text/javascript"> setTimeout(function(){$('.web').fadeOut('fast')},25000)</script> <div class="web" style="display: none;position:fixed;bottom:5px;right:10px;z-index: 999;"><img src="/iconka/svjaz_obratnaja.png"/></div> |
Модальное окно открытие и закрытие по таймеру или крестику
alex72bel,
http://javascript.ru/forum/misc/6045...tml#post402083 <!DOCTYPE HTML> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> #parent_popup { background-color: rgba(0, 0, 0, 0.8); display: none; position: fixed; z-index: 99999; top: 0; right: 0; bottom: 0; left: 0; } #parent_popup.show{ display: block; } #popup { background: #fff; width: 520px; margin: 10% auto; padding: 5px 20px 13px 20px; border: 10px solid #ddd; position: relative; /*--CSS3 Тени для Блока--*/ -webkit-box-shadow: 0px 0px 20px #000; -moz-box-shadow: 0px 0px 20px #000; box-shadow: 0px 0px 20px #000; /*--CSS3 Скругленные углы--*/ -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; } .close { background-color: rgba(0, 0, 0, 0.8); border: 2px solid #ccc; height: 24px; line-height: 24px; position: absolute; right: -24px; cursor: pointer; font-weight: bold; text-align: center; text-decoration: none; color: rgba(255, 255, 255, 0.9); font-size: 14px; text-shadow: 0 -1px rgba(0, 0, 0, 0.9); top: -24px; width: 24px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; border-radius: 15px; -moz-box-shadow: 1px 1px 3px #000; -webkit-box-shadow: 1px 1px 3px #000; box-shadow: 1px 1px 3px #000; } .close:hover { background-color: rgba(0, 122, 200, 0.8); } </style> </head> <body> <div id="parent_popup" > <div id="popup"> <h1>«Всплывающее окно при загрузке сайта»</h1> <p>Это пример простого модального окна, всплывающего при загрузке сайта, с эффектом затемнения фона и возможностью управления временем появления.</p> <p>Его можно использовать с различным содержанием, будь то просто объявление, реклама какого-либо продукта, подписная форма, форма регистрации или же форма обратной связи.</p> <a class="close"title="Закрыть" >X</a> </div> </div> <script> window.addEventListener("DOMContentLoaded", function() { var d = document.querySelector("#parent_popup"), e = document.querySelector(".close"); e.addEventListener("click", function(a) { a.preventDefault(); d.classList.toggle("show"); }) window.setTimeout(function() { d.classList.toggle("show"); window.setTimeout(function() { d.classList.contains("show") && d.classList.toggle("show") },5000) //open },5000) //pause }); </script> </body> </html> |
рони, Классно.. Спасибо. А как прикрутить к нему куки, чтобы он появлялся один раз в неделю .
|
alex72bel,
а почитать самому доку? https://learn.javascript.ru/cookie window.addEventListener("DOMContentLoaded", function() { var d = document.querySelector("#parent_popup"), e = document.querySelector(".close"); e.addEventListener("click", function(a) { a.preventDefault(); d.classList.toggle("show"); }) function getCookie(name) { var matches = document.cookie.match(new RegExp( "(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)" )); return matches ? decodeURIComponent(matches[1]) : undefined; } !getCookie('rem') && window.setTimeout(function() { var date = new Date(new Date().getTime() + 7 * 24 * 60 * 60 * 1000); document.cookie = "rem=yes; path=/; expires=" + date.toUTCString(); d.classList.toggle("show"); window.setTimeout(function() { d.classList.contains("show") && d.classList.toggle("show") },5000) //open },5000) //pause }); |
рони, А я не шарю все-равно в скриптах ... )) Как-то пытался но все никак не дошло
|
рони,А тут можете мне помочь? http://javascript.ru/forum/misc/6066...dio-fajjl.html
|
рони, А если я скриты всплывающего окна размещу в отдельный файл, будет ли он работать? Просто у меня тестового сайта нет и негде проверить к сожалению??? Именно если положу его так
<script type="text/javascript" src="ссылка на скрипт"></script> |
Цитата:
|
рони,Спасибо!!
|
рони,Если я правильно понимаю, то сюда например, если поменять 7 на 14,то будет окно показываться один раз в две недели. А как сделать чтобы один раз в день? Поставить - 1 ???
var date = new Date(new Date().getTime() + 7 * 24 * 60 * 60 * 1000); |
Часовой пояс GMT +3, время: 00:39. |