Launcher
logo  
RSS news bestarchive

Выберите раздел


» »

Оповещение о новом сообщении как Вконтакте.
30.09.2012, 16:08

При отправке Сообщения скрипт оповещает получателя, о новом сообщении которое представляет собой удобное, анимационно всплывающее, изящно красивое, и легко управляемое окно.


Но это не всё! В данной версии скрипта произошли массовые изменения, Теперь если сообщение приходит происходит звуковое оповещение, при переходе на другую страницу окно не пропадет как в прошлой версии, оно появляется в новь до закрытия его вами.

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


Установка

1. Установка jQuery.cookies
в Начало шапки сайта вставить jQuery.cookies:
Важно! если у вас уже установлен данный плагин, то этот шаг пропускаем.



Code
<script type="text/javascript">jQuery.cookie=function(a,b,c){if(arguments.length>1&&String(b)!=="[object Object]"){c=jQuery.extend({},c);if(b===null||b===undefined){c.expires=-1}if(typeof c.expires==='number'){var d=c.expires,t=c.expires=new Date();t.setDate(t.getDate()+d)}b=String(b);return(document.cookie=[encodeURIComponent(a),'=',c.raw?b:encodeURIComponent(b),c.expires?'; expires='+c.expires.toUTCString():'',c.path?'; path='+c.path:'',c.domain?'; domain='+c.domain:'',c.secure?'; secure':''].join(''))}c=b||{};var e,decode=c.raw?function(s){return s}:decodeURIComponent;return(e=new RegExp('(?:^|; )'+encodeURIComponent(a)+'=([^;]*)').exec(document.cookie))?decode(e[1]):null};</script>


2. Установка основного Скрипта
в Конец шапки сайта ставим скрипт:



Code
<script type="text/javascript">  
  var no_ava = 'http://upost.su/u/img/soobch/no_ava.gif';  
  var uBox_mus = 'http://upost.su/u/mp3/new_ls.mp3';  
  $.getScript('http://upost.su/u/js/pmm.upost.su.v.2.js');  
  </script>  
 


3. Настройка скрипта
no_ava в данной переменной указывается ссылка на не указанный аватар.
no_ava ссылка на звук оповещения об сообщении.

4. Установка стилей



Code
.uPM{  
  position:relative;z-index:9999  
  }  
  .uBox{  
  position:fixed;bottom:5px;right:5px;z-index:9999  
  }  
  .uBoxMesssge{  
  display:none;  
  padding: 5px;  
  margin-bottom: 10px;  
  width:300px;  
  background: url(http://upost.su/u/img/soobch/uContent-bg.png);  
  padding: 7px;  
  -webkit-border-radius: 5px;  
  -moz-border-radius: 5px;  
  border-radius: 5px;  
  -moz-box-shadow: 0px 2px 7px rgba(0, 0, 0, 0.70);  
  -webkit-box-shadow: 0px 2px 7px rgba(0, 0, 0, 0.70);  
  box-shadow: 0px 2px 7px rgba(0, 0, 0, 0.70);  
  }  
  .uBoxTitle b{  
  font: bold 11px Tahoma !important;  
  }  
   
  .uBoxMesssge *{  
  font: 11px Tahoma;  
  color:#fff;  
  text-shadow:0px 1px 0px rgba(0, 0, 0, 0.70);  
  }  
  .uBoxAva{  
  -webkit-border-radius: 3px;  
  -moz-border-radius: 3px;  
  border-radius: 3px;  
  width:50px;  
  }  
   
  .uBox_close{  
  background: #000;  
  -moz-border-radius: 3px;  
  -webkit-border-radius: 3px;  
  border-radius: 3px;  
  -moz-box-shadow: 0 0 2px #111;  
  -webkit-box-shadow: 0 0 2px #111;  
  box-shadow: 0 0 2px #111;  
  padding: 5px;  
  margin: 0 0 0 10px;  
  opacity: 0.6;  
  width: 7px;  
  float:right  
  }  
   
  .uBox_close_s{  
  display: block;  
  background: url("http://upost.su/u/img/soobch/notifier_close.gif") no-repeat scroll 0 0 transparent;  
  opacity: 0.6;  
  width: 7px;  
  height: 7px;  
  }  
  .uBox_close_s:hover{  
  opacity: 1.0;  
  }  
  .uBoxTheme{  
  padding-left:5px;  
  color:#bbb;  
  }  
  .uBoxMessaged{  
  padding-left:5px;  
  }  
  .uBoxMessaged a{  
  color:#fff;  
   
  }


5. Установка окончена
Сохраните шаблон.





+5








Похожие материалы:





| Категория: | Добавил: Dzheykey | Теги: о новом, оповещение, как Вконтакте, сообщение, скрипты
Просмотров: 1907 | Загрузок: | Рейтинг: 5.0/5


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

Язык/Lang


Архив записей

Все

Юзеры

Гости

Онлайн всего: 1
Гостей: 1
Пользователей: 0

Контакты/Contact

Связь с администратором

Друзья сайта

I Love Pink Floyd

Топ пользователей

Именинники


На bestarchive