Главная · Правила · Воскресенье, 21.09.2025, 23:59
Вход · Регистрация



Интересное

  • Статьи [18]
    Скрипты [39]
  • Статистика



    Новое, красивое оповещение ЛС для ucoz

    Представляю вашему вниманию красивое и стильное оповещение о ЛС для ucoz.

    Что в данной версии уникального:
    1. Есть красивая кнопка "close"
    2. Округлил углы
    3. Добавлена анимация
    4. Новое зЗ

    Установка

    Включите API в "Общих настройках" Панели управления.

    Вставьте следующий код здесь:

    Панель управления - Управление дизайном - Нижняя часть сайта.

    Код
    <!--Оповещение ЛС-->   

       <?if($USER_LOGGED_IN$)?>   
       <div id="one_pm" class="bounceIn animated"></div>   
       <script type="text/javascript">   
       var no_ava = 'http://webo4ka.ru/webo4ka/img/W.png';   
       var this_mess_link = '';   
       function m_reload() {   
       if($('#one_pm').html()=='') {   
       $.get('/index/14?'+Math.random(), function (data) {   
       $('b.unread', data).each(function (i,index) {   
       getLink = $(index).parent().attr("href");   
       this_mess_link = getLink;   
       getText = $(index).parent().text();   
       getAuthorName = $(index).parent().parent().children('a').eq(1).text();   
       getAuthor = $(index).parent().parent().children('a').eq(1).attr("href");   
       getID = '#one_pm'+i;   
       var xml = $.ajax({   
       type: 'GET',   
       url: '/api/index/8-0-'+getAuthorName.replace('-','~'),   
       dataType: 'xml',   
       async: false   
       };).responseText;   
       var urlAvatar = $(xml).find('struct:first member:contains("USER_AVATAR")').find('string').text();   
       var userName = $(xml).find('struct:first member:contains("USER_NAME")').find('string').text();   
       $('#one_pm').html('<div id="one_pm'+i+'" style="display:none" class="bounceIn animated">'   
       +'<div class="h_newpm">'   
       +'<div class="h_npin" align="center"><a class="h_nover" href="'+getLink+'"></a>'   
       +'<div class="h_nptitle">Новое сообщение</div><span class="h_del" onclick="h_del();return false;"></span>'   
       +'<div class="h_npl"><div class="h_npimg"><a href="#" id="hnp_avatar"></a></div></div>'   
       +'<div class="h_npr"><a href="#" id="hnp_author"></a> <a id="hnp_text" href="'+getLink+'">'+getText+'</a></div>'   
       +'</div>'   
       +'</div>'   
       +'</div><div id="hnp_sound"></div>');   
       $(getID+' #hnp_author').attr('href', getAuthor);   
       $(getID+' #hnp_avatar').attr('href', getAuthor);   
       $(getID+' #hnp_author').html(userName);   
       $(getID+' #hnp_avatar').html('<img src="'+ (urlAvatar == '' ? no_ava : urlAvatar )+'">');   
       setTimeout(function(){$(getID).slideDown(200);},200);   
       $('#hnp_sound').html('<audio src="http://webo4ka.ru/Ucoz8/gently.mp3" volume="1" autoplay></audio>');setTimeout(function(){$('#hnp_sound').html('')},2000);   
       };);   
       };);   
       }   
       }   
       function h_del() {$('#one_pm').fadeOut(200,function(){$('#one_pm').html('<i></i>')};);$.get(this_mess_link);}   
       m_reload();setInterval(function(){m_reload()}, 15000);   
       </script>   
       <style type="text/css">   
       #one_pm { position: fixed;   
       top: 80px;   
       cursor: pointer;   
       font-family: Tahoma,Arial,Verdana,sans-srif;   
       width: 300px;}   
       #hnp_sound {position:absolute;top:-1000px;left:-1000px}   
       #hnp_author span {display:none}   
       .h_newpm { position: relative;   
       height: 110px;   
       margin-bottom: 20px;   
       color: #555;   
       padding: 8px 8px!important;   
       background: #fff!important;   
       border-radius: 90px;}   
       .h_newpm #hnp_author {color:#555;font-weight:bold;text-decoration:none;}   
       .h_newpm #hnp_author:hover {color:#555;text-decoration:underline}   
       .h_npin {padding:5px;padding-top:5px}   
       .h_nptitle {color:#555;font-size:13px;font-weight:bold;padding-bottom:0px}   
       .h_npimg {width:57px;height:57px;overflow:hidden;-webkit-border-radius: 90px;-moz-border-radius:90px;border-radius: 90px;}   
       .h_npimg img {width:100%;-webkit-border-radius: 90px;-moz-border-radius: 90px;border-radius: 90px;}   
       .h_npl {position:absolute;left:13px;top:45px;z-index:3;width:70px}   
       .h_npr {position:absolute;left:84px;top:45px;z-index:3;color:#555;font-size:13px;padding-right:14px}   
       .h_npr #hnp_text, .h_npr #hnp_text:hover {display:block;text-decoration:none;color:#555}   
       .h_newpm:hover .h_del {display:inline-block;}   
       .h_del {display: none;cursor: pointer;position: absolute!important;right: 10px;top: 40px;margin: 0!important;z-index: 10014!important;width: 36px!important;height: 36px!important;background: url(http://webo4ka.ru/Ucoz8/ajax_p.png) no-repeat!important;}   
       .h_del:hover {background-position:0px 18px}   
       .h_nover {position:absolute;top:0px;left:0px;width:100%;height:100%;}   
       .animated {   
       -webkit-animation-duration: 1s;   
       animation-duration: 1s;   
       -webkit-animation-fill-mode: both;   
       animation-fill-mode: both;   
       }   

       .animated.infinite {   
       -webkit-animation-iteration-count: infinite;   
       animation-iteration-count: infinite;   
       }   

       .animated.hinge {   
       -webkit-animation-duration: 2s;   
       animation-duration: 2s;   
       }   

       /*the animation definition*/   

       @-webkit-keyframes bounceIn {   
       0%, 100%, 20%, 40%, 60%, 80% {   
       -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);   
       transition-timing-function: cubic-bezier(0.215, .61, .355, 1)   
       }   
       0% {   
       opacity: 0;   
       -webkit-transform: scale3d(.3, .3, .3);   
       transform: scale3d(.3, .3, .3)   
       }   
       20% {   
       -webkit-transform: scale3d(1.1, 1.1, 1.1);   
       transform: scale3d(1.1, 1.1, 1.1)   
       }   
       40% {   
       -webkit-transform: scale3d(.9, .9, .9);   
       transform: scale3d(.9, .9, .9)   
       }   
       60% {   
       opacity: 1;   
       -webkit-transform: scale3d(1.03, 1.03, 1.03);   
       transform: scale3d(1.03, 1.03, 1.03)   
       }   
       80% {   
       -webkit-transform: scale3d(.97, .97, .97);   
       transform: scale3d(.97, .97, .97)   
       }   
       100% {   
       opacity: 1;   
       -webkit-transform: scale3d(1, 1, 1);   
       transform: scale3d(1, 1, 1)   
       }   
       }   

       @keyframes bounceIn {   
       0%, 100%, 20%, 40%, 60%, 80% {   
       -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);   
       transition-timing-function: cubic-bezier(0.215, .61, .355, 1)   
       }   
       0% {   
       opacity: 0;   
       -webkit-transform: scale3d(.3, .3, .3);   
       -ms-transform: scale3d(.3, .3, .3);   
       transform: scale3d(.3, .3, .3)   
       }   
       20% {   
       -webkit-transform: scale3d(1.1, 1.1, 1.1);   
       -ms-transform: scale3d(1.1, 1.1, 1.1);   
       transform: scale3d(1.1, 1.1, 1.1)   
       }   
       40% {   
       -webkit-transform: scale3d(.9, .9, .9);   
       -ms-transform: scale3d(.9, .9, .9);   
       transform: scale3d(.9, .9, .9)   
       }   
       60% {   
       opacity: 1;   
       -webkit-transform: scale3d(1.03, 1.03, 1.03);   
       -ms-transform: scale3d(1.03, 1.03, 1.03);   
       transform: scale3d(1.03, 1.03, 1.03)   
       }   
       80% {   
       -webkit-transform: scale3d(.97, .97, .97);   
       -ms-transform: scale3d(.97, .97, .97);   
       transform: scale3d(.97, .97, .97)   
       }   
       100% {   
       opacity: 1;   
       -webkit-transform: scale3d(1, 1, 1);   
       -ms-transform: scale3d(1, 1, 1);   
       transform: scale3d(1, 1, 1)   
       }   
       }   

       .bounceIn {   
       -webkit-animation-name: bounceIn;   
       animation-name: bounceIn   
       }   
         
       </style>   
       <?endif?>

    Скрипт рабочий сам проверял
    Категория: Скрипты Добавил: Modo
    Просмотров: 68 | Рейтинг: 0.0/0
    Всего комментариев: 0
    avatar

    Наш сервис

    • Наш Чат
    • Фото хостинг
    • Скачать

    Календарь

    Яндекс.Метрика Top.Mail.Ru

    Календарь

    [15.11.2023]Свои драйверы в driverpack
    [27.10.2023]ртефакты силы
    [28.08.2023]Процессор Intel Core i3-2130 Sandy Bridge LGA1155, 2 x 3400 МГц Процессор Intel Core i3-2130 Sandy Bridge LGA1155, 2 x 3400 МГц, OEM
    [12.08.2023]Как отключить добавление слова «ярлык» при создании ярлыков
    [28.07.2023]Как разобраться в кроссоверах телевселенной DC — читайте на «Мире фантастики»!
    [16.06.2023]Открытие файлов в формате DDS
    [24.05.2023]Как создать движок для сайта
    [15.05.2023]Описание серий сериала «Звёздные врата SG-1». 3 сезон.
    [15.05.2023]Описание серий сериала «Звёздные врата SG-1». 2 сезон.
    [15.05.2023]Описание серий сериала «Звёздные врата SG-1». 1 сезон.

    Новое видео

    Флешка или SSD не форматируется. Что делать?

    • Просмотры:
    • Всего комментариев: 0
    • Рейтинг: 0.0
    00:01:24

    Как переводить программы на русский язык

    • Просмотры:
    • Всего комментариев: 0
    • Рейтинг: 0.0
    00:01:23

    как поменять стандартную картинку при запуске windows 7

    • Просмотры:
    • Всего комментариев: 0
    • Рейтинг: 0.0
    00:04:44

    монитор acer гаснет через 2 сек. после включения.

    • Просмотры:
    • Всего комментариев: 0
    • Рейтинг: 0.0
    00:14:20

    Ремонт монитора acer AL1916. Монитор не включается и мигает индикатор

    • Просмотры:
    • Всего комментариев: 0
    • Рейтинг: 0.0

    ff Мобильная версия · Для правообладателей