» »

Стильные всплывающие окна на сайте


Стильные всплывающие окна на сайте

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

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

Установка:

Заливаем файлы из архива в корень сайта.

Теперь давайте разберемся как подключить код с оформлением. Здесь нужно поставить его между тегами head и /head на странице.

Код
<link rel="stylesheet" type="text/css" href="http://zornet.ru/Aben/Gsa/zartyn/dialog_box.css" />  
<script type="text/javascript" src="http://zornet.ru/Aben/Gsa/zartyn/dialog_box.js"></script>


Ссылка вызова:

Код
<a href="javascript:showDialog('Ошибка','Ошибка, она и в Африке ошибка.','error',2);">Ошибка</a>

<a href="javascript:showDialog('Предупреждение','Вы должны ввести всю необходимую информацию.','warning');">Предупреждение</a>

<a href="javascript:showDialog('Успех','Ваш запрос был успешно получен.','success');">Успех</a>

<a href="javascript:showDialog('Подсказка','Вы уверены, что хотите удалить запись ?','prompt');">Подсказка</a>


Но потом выбираем, что будем ставить, как выбрали, то можете потом в нем как вы видите написать, хотя возможно переименовать, но у каждого свое, главное что смысл написанного подходил под гамму цвета, это важно.

PS - в самом архиве находиться файл демонстраций, где вы можете визуально все посмотреть и оценить, нужно вам на сайт такая функция.
20.11.2016 Загрузок: 3 Просмотров: 276 Комментарий: (7)

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

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

Комментарий: 7
kiva
kiva 20.11.2016 16:371
0
Так не сего заветные окна, просто не нравятся слишком яркие, здесь как раз что нужно. Теперь осталось установить и под что только. Это что то как модельные окна или здесь не поставить скрипт в тело кода.
Brung
Brung 20.11.2016 16:492
0
На счет скрипта и его размещение не знаю, но описание точно, так и сделано, и это не модальное окно.
Kosten
Kosten 20.11.2016 18:003
0
Но к примеру уже написаны, как подсказка или замечание, что вообщем сами придумаете, что то по тематике возможно.
ucozmental
ucozmental 21.11.2016 00:334
0
Так нудное, но вот дизайн мне не очень нравится, кто то пишет, что светло зеленый, мне как раз лучше яркий, чтоб видно было, а не напрягать зрение.
Сафрон
Сафрон 21.11.2016 00:365
0
Но здесь каждому свое, но нужно всегда отталкиваться от дизайн сайта, то так не логично будет, что сайт построен по одному стилю, а окно появляется яркое.
csretven
csretven 21.11.2016 00:426
0
Все правильно, то иногда зайдешь на сайт, он светлый, но поиск по сайту стоит на всю ширину и темный. Просто у каждого свои вкусы на этот счет, а этот поиск не новый, уже на многих сайтах его встречал, но вот скрипт в первые вижу.
Brung
Brung 21.11.2016 00:487
0
Так видно, что под светлые сделаны окна, но там идет несколько, что вы на сайт все оттенки собрались ставить, а и что вообще можно вывести, так для одного еще можно.
avatar