Всплывающее окно при входе на сайт (нужна помощь)
Приветствую! Помогите чайнику! :)
Имеется всплывающее окно которое автоматически появляется при входе на сайт. Как сделать так, чтоб была возможность открывать данное окошко еще и нажатием на определенную ссылку на странице? Как в таком случае должен выглядеть <a href=... Заранее благодарствую за ответ! Ниже скрипт окошка: <style> #popup { display: table; position: fixed; top: 0; left: 0; z-index: 100; height: 100%; width: 100%; background: rgba(240,240,240,.9); visibility: hidden; animation: animaciya 1s 5s forwards; /* 5s - это количество секунд по истечении которых появляется сообщение */ cursor: pointer; } @keyframes animaciya { from {visibility: hidden;} to {visibility: visible;} } #popup figure { display: table-cell; vertical-align: middle; } #popup div, #popup figcaption, #popup figure:before { max-width: 500px; /* максимальная ширина */ margin: 0 auto; border-style: solid; border-color: rgb(88,125,164); background: #fff; } #popup figure:before { /* стиль кнопки "закрыть" */ content: "закрыть"; display: block; padding: 0 1%; border-width: 4px 4px 0 4px; border-radius: 5px 5px 0 0; text-align: right; color: rgb(88,125,164); } #popup div, #popup figcaption { padding: 1%; cursor: default; } #popup figcaption { position: relative; border-width: 0 4px 0 4px; font-size: 150%; text-transform: uppercase; color: rgb(100,100,100); } #popup figcaption:before { /* стиль восклицательного знака, не поддерживается Google Chrome. Его можно заменить на что-то более приемлемое */ content: "\26a0 \20 \20"; color: red; font-size: 150%; vertical-align: middle; } #popup div { border-width: 0 4px 4px 4px; border-radius: 0 0 5px 5px; } </style> <div id="popup"> <figure> <figcaption>заголовок</figcaption> <div>содержание</div> </figure> </div> <script> window.onkeyup = okno; // нажатие Esc, см. условие "e.keyCode==27" document.getElementById('popup').onclick = okno; function okno(e) { if (e.target.nodeName != 'DIV' && e.target.nodeName != 'FIGCAPTION' || e.keyCode==27) { // через && перечисляются теги, клинкув на которые окно не будет закрыто; сюда же можно включить тег A или IFRAME document.getElementById('popup').style.display='no ne'; localStorage.setItem('popup1', 'none'); } } if(localStorage.getItem('popup1')) { document.getElementById('popup').style.display='no ne'; } </script> |
Часовой пояс GMT +3, время: 00:59. |