Данный скрипт позволяет выводить очень удобное стильное окно при новых личных сообщениях. Есть возможность выбора между пятью различными цветовыми схемами.
Скрин:
Архив:
http://4free.clod5.com/pm.zip Установка: В глобальный блок "Нижняя часть сайта" в самый низ:
Code
<script type="text/javascript"> var no_ava = '/images/no_avatar.jpg'; $.getScript('/js/ls.js');</script>
Далее в самый низ вашего CSS:
1) Серый скин:
Code
/* Оповещение о новом лс как Вконтакте ------------------------------------------*/ .news_ls1 { position:relative; z-index:9999; } .news_ls2 { position:fixed; bottom:5px; right:5px; } .uContent{ overflow: hidden; display:none; margin-bottom:10px; width:300px; background:url(http://www.center-dm.ru/ucoz/ls/kontakt/fon_uContent_White.png); padding:5px 10px 5px 10px; -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); } .uContent_l { float:left; font: 11px Verdana,Arial,Helvetica, sans-serif; color:#555; text-shadow: 1px 1px 1px #fff; font-weight: bold; } .uContent_p {float:right;} .uContent_c { float:left; font: 100%/1.0 Verdana,Arial,Helvetica, sans-serif; width:300px; padding: 5px 0px 0px 0px; } .uPm-close { width:18px; height:18px; background:url(http://www.center-dm.ru/ucoz/ls/kontakt/knopka_closse_White.png) no-repeat; } .uPm-close:hover { background-position:0px -18px; } .uContent_c img { float:right; width:45px; height:45px; border:1px solid #a7a7a7; padding: 3px; margin: 0px 0px 10px 15px; background:#fff; } .uContent_c span { color:#547ec4; } .uContent_c p { padding:0; margin: 5px 0px 0px 0px; } .uContent_c a:link, .uContent_c a:visited {color:#555;} .uContent_c a:hover {color:#4a6ca5;} /* -------------------------------------- */
2) Синий скин:
Code
/* Оповещение о новом лс как Вконтакте ------------------------------------------*/ .news_ls1 { position:relative; z-index:9999; } .news_ls2 { position:fixed; bottom:5px; right:5px; } .uContent{ overflow: hidden; display:none; margin-bottom:10px; width:300px; background:url(http://www.center-dm.ru/ucoz/ls/kontakt/fon_uContent_Blue.png); padding:5px 10px 5px 10px; -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); } .uContent_l { float:left; font: 11px Verdana,Arial,Helvetica, sans-serif; color:#6e87c6; text-shadow: 1px 1px 1px #fff; font-weight: bold; } .uContent_p {float:right;} .uContent_c { float:left; font: 100%/1.0 Verdana,Arial,Helvetica, sans-serif; color:#555; width:300px; padding: 5px 0px 0px 0px; } .uPm-close { width:18px; height:18px; background:url(http://www.center-dm.ru/ucoz/ls/kontakt/knopka_closse_Blue.png) no-repeat; } .uPm-close:hover { background-position:0px -18px; } .uContent_c img { float:right; width:45px; height:45px; border:1px solid #99bee4; padding: 3px; margin: 0px 0px 10px 15px; background:#fff; } .uContent_c span { color:#43983f; } .uContent_c p { padding:0; margin: 5px 0px 0px 0px; } .uContent_c a:link, .uContent_c a:visited {color:#555;} .uContent_c a:hover {color:#999;} /* -------------------------------------- */
3) Зеленый скин:
Code
/* Оповещение о новом лс как Вконтакте ------------------------------------------*/ .news_ls1 { position:relative; z-index:9999; } .news_ls2 { position:fixed; bottom:5px; right:5px; } .uContent{ overflow: hidden; display:none; margin-bottom:10px; width:300px; background:url(http://www.center-dm.ru/ucoz/ls/kontakt/fon_uContent_Green.png); padding:5px 10px 5px 10px; -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); } .uContent_l { float:left; font: 11px Verdana,Arial,Helvetica, sans-serif; color:#1dbb19; text-shadow: 1px 1px 1px #fff; font-weight: bold; } .uContent_p {float:right;} .uContent_c { float:left; font: 100%/1.0 Verdana,Arial,Helvetica, sans-serif; color:#555; width:300px; padding: 5px 0px 0px 0px; } .uPm-close { width:18px; height:18px; background:url(http://www.center-dm.ru/ucoz/ls/kontakt/knopka_closse_Green.png) no-repeat; } .uPm-close:hover { background-position:0px -18px; } .uContent_c img { float:right; width:45px; height:45px; border:1px solid #77ca79; padding: 3px; margin: 0px 0px 10px 15px; background:#fff; } .uContent_c span { color:#5976c0; } .uContent_c p { padding:0; margin: 5px 0px 0px 0px; } .uContent_c a:link, .uContent_c a:visited {color:#555;} .uContent_c a:hover {color:#999;} /* -------------------------------------- */
4) Оранжевый скин:
Code
/* Оповещение о новом лс как Вконтакте ------------------------------------------*/ .news_ls1 { position:relative; z-index:9999; } .news_ls2 { position:fixed; bottom:5px; right:5px; } .uContent{ overflow: hidden; display:none; margin-bottom:10px; width:300px; background:url(http://www.center-dm.ru/ucoz/ls/kontakt/fon_uContent_Orange.png); padding:5px 10px 5px 10px; -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); } .uContent_l { float:left; font: 11px Verdana,Arial,Helvetica, sans-serif; color:#e7ad3c; text-shadow: 1px 1px 1px #fff; font-weight: bold; } .uContent_p {float:right;} .uContent_c { float:left; font: 100%/1.0 Verdana,Arial,Helvetica, sans-serif; color:#555; width:300px; padding: 5px 0px 0px 0px; } .uPm-close { width:18px; height:18px; background:url(http://www.center-dm.ru/ucoz/ls/kontakt/knopka_closse_Orange.png) no-repeat; } .uPm-close:hover { background-position:0px -18px; } .uContent_c img { float:right; width:45px; height:45px; border:1px solid #f6c76a; padding: 3px; margin: 0px 0px 10px 15px; background:#fff; } .uContent_c span { color:#4876c1; } .uContent_c p { padding:0; margin: 5px 0px 0px 0px; } .uContent_c a:link, .uContent_c a:visited {color:#444;} .uContent_c a:hover {color:#999;} /* -------------------------------------- */
5) Черный скин:
Code
/* Оповещение о новом лс как ВКонтакте ------------------------------------------*/ .news_ls1 { position:relative; z-index:9999; } .news_ls2 { position:fixed; bottom:5px; right:5px; } .uContent{ overflow: hidden; display:none; margin-bottom:10px; width:300px; background:url(http://www.center-dm.ru/ucoz/ls/kontakt/fon_uContent_Black.png); padding:5px 10px 5px 10px; -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); } .uContent_l { float:left; font: 11px Verdana,Arial,Helvetica, sans-serif; color:#a7a7a7; text-shadow: 1px 1px 1px #252525; font-weight: bold; } .uContent_p {float:right;} .uContent_c { float:left; font: 100%/1.0 Verdana,Arial,Helvetica, sans-serif; color:#a7a7a7; width:300px; padding: 5px 0px 0px 0px; } .uPm-close { width:18px; height:18px; background:url(http://www.center-dm.ru/ucoz/ls/kontakt/knopka_closse_Black.png) no-repeat; } .uPm-close:hover { background-position:0px -18px; } .uContent_c img { float:right; width:45px; height:45px; border:1px solid #838383; padding: 3px; margin: 0px 0px 10px 15px; background:#646464; } .uContent_c span { color:#8fbbe9; } .uContent_c p { padding:0; margin: 5px 0px 0px 0px; } .uContent_c a:link, .uContent_c a:visited {color:#f7f7f7;} .uContent_c a:hover {color:#bdbdbd;} /* -------------------------------------- */
Скрипт из прикреплённого архива залейте в папку
js , картинку no_avatar.jpg в папку
images Все остальные картинки залиты на случай, если ссылки на них станут битыми
Чтобы скачивать файлы вам нужна
Авторизация
или
Регистрация
Это займёт не больше 2х минут...
Скриншот
·
Поблагадорить
·
Жаловаться