Приветствуем Вас на сайте!

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

Если у Вас ещё нет аккаунта на BEST STUDIO, вы можете создать его потратив не более 10-ти секунд используя форму справа с заголовком "Вход на сайт"

Вход на сайт

Логин:

Пароль:

Вход

Войти по Логину и Паролю

О нас

Cтудия скриптов и дизайна BEST STUDIO, как студия перспективных веб-разработок, была основана 1 июля 2009 г. Уже более 17000 зарегистрированых пользователей! С момента ее создания мы четко придерживаемся принципа: «Быстро, качествено, дорого».

Заказывая работу для вашего сайта у нас, вы экономите время...

Стремитесь к лучшему - в Best Studio!

Войти | Зарегистрироваться

Настройки

Анимация Шапки

Анимация Футера

Автообновление Чата

Автообновление Статистики

Звуковые Оповещения

Авто Подгрузка Материалов

Перезагрузите страницу

Кнопка уведомлений

DEMO +

Всем привет сегодня у нас легкий и небольшой но полезный скрипт который позволит админам при работе с сайтом закрывать временно разделы с уведомлением пользователя.

Возможности:
1. Ставить любой текст и без ограничений кнопок уведомлений!.
2. Добавлен audio
3. Легко кастомизировать и добавить свои функции (Картинку и т.д).

Установка:
1. Добавим html вызов кнопки onclick:

Код

<div class="push-add" onclick="push.call('Best Studio','https://woobl.ru/other/cl3.m4a')">Кнопка</div>

1~1. Уведомление при загрузке страницы(js):

Код

push.call('Best Studio','https://woobl.ru/other/cl3.m4a');

В html\скрипте:
Best Studio - Тест нашего уведомления
https://woobl.ru/other/cl3.m4a - Звук уведомления.

2. Добавим js:

Код

push = {
call:function(pushInfo,file){
$('.push').html(pushInfo).fadeIn(500).delay(4000).fadeOut(500);
mp3=new Audio(file);mp3.src=file;mp3.play();
}
}

3. Добавим вид уведомлению:

Код

.push-add {
  background: #2B587A;
  padding: 16px 7px;
  color: #fff;
  font-size: 11px;
  font-family: sans-serif;
  border-radius: 5px;
  font-weight: bold;
  text-align: center;
}
.push {
  display:none;
  position: fixed;
  bottom: 100px;
  background: #5f96fd;
  color: #fff;
  padding: 10px;
  border-radius: 50px;
  font-family: font1;
  z-index: 9999;
  text-align: center;
  left: 25%;
  right: 25%;
}

P.s Для добавления своего текста или прочего делаем в html разметку ,'Мой текст' далее в js через запятую добавим переменную пример: (pushInfo,file,MoiText) дальше вы можете использовать переменную MoiText как вам угодно.

Данный раздел авторский все работы являются собственностью ucods.3dn.ru любое коммерческое использование строго запрещено.

При копировании материала указываем источник ucods.3dn.ru

Для редактирования кода необходимо иметь хотя бы базовые знания в HTML, CSS и Js технологиях.

Поделиться новостью в социальной сети.

Добавил: Best_Studio

Дата добавления: 24.03.2018 в 16:33 по МСК

Категория: Другие модули

Просмотров: 752

Комментариев: 0

Эмоций:

Оценки читателей

ЗАКРЫТЬ

0 Лайк
0 Лавки
0 Ахахах!
0 Ого!
0 Восторг
0 Печаль
0 Грусняшь

Теги: Notification, Push, Alert

Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]