» »

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

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

Появление окна при выходе с интернет сайт, которое появится по центру с той или иной просьбой, это может быть как опрос или обратная. связь. В самом скрипте вы обнаружите MFORM_5, что отвечает за ту или иную функцию, это и есть основа, что вы можете изменить. И поставить тот оператор, что вам нужно как по тематике и вообще, это может быть социальной сети в контакте. Цветовая гамма возможно разнообразной, все зависит от веб мастера стилей, что ему предоставлены с материалом.

Или все сделать самому, это тоже как вариант.

Чтоб его убрать и оно не мешалось, просто клик делаем на крестик и оно исчезнет. Но некоторым пользователям совершенно не нравиться такая тема. Они его принимают за рекламный баннер. Что здесь изначально все указать правильно, что это не навязчивые баннеры. Что тот написано для вас новость или сообщение, чтоб как можно больше прочли.

ВСПЛЫВАЮЩЕЕ ОКНО ПРИ ЗАКРЫТИИ СТРАНИЦЫ

HTML

Это ставим в нижнюю часть сайта в самый низ или на тех страницах где нужно, перед /body

Код
<noindex>
<div class="exitblock"> <div class="fon"></div> <div class="modaltext"> <div class="title"><center>Остались вопросы? <br><span style="font-size:large">Пишите, то что считаете нужным, что типа напишите, я вам отвечу</span></center></div> $MFORM_5$ </div></div>
<script type="text/javascript">$(document).mouseleave(function(a){a.clientY<0&&$(".exitblock").fadeIn("fast")}),$(document).click(function(a){$(".exitblock").is(":visible")&&!$(a.target).closest(".exitblock .modaltext").length&&$(".exitblock").remove()});</script>
</noindex>

CSS

Код
.exitblock{display:none;position:fixed;left:0;top:0;width:100%;height:100%;z-index:1}
.exitblock .fon{background:#F6FCFF;opacity:.8;position:fixed;width:100%;height:100%}
.exitblock .modaltext{box-sizing:border-box;padding:20px 40px;border:2px solid #aeaeae;background:#f6fcff;position:fixed;top:100px;width:40%;box-shadow:0 4px 10px 2px rgba(0,0,0,0.5);right:0;left:0;margin:0 auto}
.exitblock .title{ font-family:Jura-Medium;color:#337AB7;font-size:20px}
.title{border-bottom:1px solid #dcdbd7;margin:20px 0;padding-bottom:20px;position:relative}
.title::before{background-color:#337AB7;border-radius:500px;bottom:-5px;content:"";height:10px;left:0;position:absolute;width:10px}
.title::after{border-bottom:2px solid #337AB7;bottom:-1px;content:"";height:0;left:0;position:absolute;width:65px}
17.10.2017 Просмотров: 374 Комментарий: (9)

Поделиться в социальных сетях

Материал разместил

Комментарий: 9
workman
workman 17.10.2017 19:051
0
Немного не правильное описание. Не при ВХОДЕ на сайт а при ВЫХОДЕ из него
Kosten
Kosten 17.10.2017 19:112
0
workman, привет, исправлю, просто в поиске набрал эти окна, чтоб описание сделать, и видать одно работало при входе,.

Вот на форуме от автора найдете аналогичную тему.
workman
workman 17.10.2017 19:323
0
Тот кто будет забирать пусть в стилях найдет это
Код
font-family:Jura-Medium;
и поставит на свое
Kosten
Kosten 17.10.2017 19:384
0
А за что отвечает, в первые вижу?
DESTEQ
DESTEQ 18.10.2017 10:365
+1
Простое изменение шрифта в модальном окне
Kosten
Kosten 18.10.2017 19:056
+1
Спасибо, просто не встречал такой шрифт.
workman
workman 19.10.2017 03:317
+1
тута этот шрифт (Jura Medium)
Kosten
Kosten 19.10.2017 04:078
0
Думаю у гугл также есть такой шрифт, хотя они по идее все лицензионные.
avatar
otgamera 27.10.2017 09:179
0
Как работает данный скрипт?
avatar