Как сделать всплывающее окно при закрытии вкладки на jQuery

Наверное, вы замечали на некоторых сайтах такую неприятность - когда пытаетесь закрыть вкладку вылазит окно с какой-то информацией просящей пользователя обратить на нее внимание.

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

Но если вы хотите поставить подобной скрипт, то рекомендую более изящный вариант.

Срипт, который вы можете скачать и просмотреть ниже работает так. Если пользователь стал вести мышь к вкладкам браузера, чтобы выбрать другой сайт - быстро и плавно, с затемнением экрана появится ваша всплывайка, в которую вы можете поставить любой html код от картинок до видео, а также приукрасить как угодно за счет css.

Плюс данного скрипта в том, что пользователю теперь не обязательно нажимать на кнопку подтверждения, чтобы уйти с вашей странице. Он может проигнорировать окно и закрыть вкладку обычным способом. А если информация в окне его заинтересует, ему достаточно кликнуть по фону всплывайки или крестику, чтобы она исчезла.

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

Как сделать всплывающее окно при закрытии вкладки на jQuery: 2 комментария

  1. Подскажите установила скрипт все отлично работает что касается самого окна. Но возникает глюк....другие ссылки не открываются на сайте до того момента пока потом при выходе не откроется оно и после закрытия уже всплывающего ссылки становятся активными. Благодарю за ответ и помощь

    1. Действительно есть такая проблема - добавьте в css: .outssye { display: block; } и в .outss { display: none; }

Добавить комментарий для Екатерина Отменить ответ

Ваш e-mail не будет опубликован. Обязательные поля помечены *


Введите капчу: