⇧
⇩

MUSIC LIFE

Объявление

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.

Вы здесь » MUSIC LIFE » Мастерская дизайна » Всплывающее окно с персональными ссылками профиля

Всплывающее окно с персональными ссылками профиля

Страница: 1

Сообщений 1 страница 2 из 2

1

  • Автор: Александр
  • Администратор
  • Александр
  • Зарегистрирован: 2011-06-01
  • Приглашений: 0
  • Сообщений: 189
  • Уважение: +1
  • Позитив: 0
  • Провел на форуме:
    1 день 15 часов
  • Последний визит:
    2014-01-21 19:45:06

Ещё один вариант. Добавлена ссылка на все сообщения автора

http://s7.uploads.ru/t/5lwHr.png

HTML-верх

<!-- пользовательские ссылки у ника ч.1 -->
<style>
.punbb .post .pa-links {display:none;position:absolute;top:25px;right:0;padding:5px;z-index:100;}
.punbb .post .pa-links ul {padding:5px 8px 5px 8px;background:#FFFCE5; border:double 3px #B38000;border-radius:5px;box-shadow:inset 0 0 2em #E5B94C; font-family:Georgia;font-weight:normal;}
.pa-links li {display:block; list-style:circle outside;float:none;padding-left:20px;height:16px;margin-bottom:5px;}
.pa-links li.pl-email {background:url(http://s7.uploads.ru/lpy5a.png) no-repeat;}
.pa-links li.pl-email:first-child {background:url(http://s7.uploads.ru/4BWKA.png) no-repeat; }
.pa-links li.pl-email:nth-child(3) {background:url(http://s6.uploads.ru/Ccg37.png) no-repeat; }
.pa-links li.pl-message {background:url(http://s6.uploads.ru/sLhyg.png) no-repeat; }
.pa-links li.pl-website {background:url(http://s6.uploads.ru/OnD1F.png) no-repeat; }
.btn-links {background:url(http://s6.uploads.ru/dZBin.png) no-repeat;width:16px;height:16px;position:absolute;top:0;right:10px;cursor:pointer;}
.post-author {position:relative;}
.post-links li.pl-email,.post-links li.pl-website {visibility:hidden;}
.punbb .pa-links li a {text-decoration:none;}
</style>

То что выделено красным отвечает за оформление всплывающего окна. Меняйте на свой вкус и цвет))
Зелёное удаляет подчёркивание ссылок в окне (за ненадобностью можно удалить)
В HTML-низ

Код:
<!-- пользовательские ссылки у ника ч.2 -->	
<script>
$(document).ready(function() {
if(document.URL.indexOf("viewtopic.php")!=-1 && GroupID != 3){
$(".pa-author").after("<div class='btn-links' title='Пользовательские ссылки'></div><li class='pa-links'><ul class='container'></ul></li>");	   
$(".post").each(function(){
$(this).find(".pl-email,.pl-website").clone().prependTo($(this).find(".pa-links ul"));
var user = $(this).find(".pl-email:first a").attr("href").match(/\d+/i);
$(this).find(".pa-links ul .pl-email:eq(0)").after("<li class='pl-message'><a rel='nofollow' href='/search.php?action=show_user&user_id="+user[0]+"'>Сообщения</a></li>");
});
$(".btn-links").click(function() {
$(this).next().slideToggle('fast');
});
}
})
</script>

0

2

  • Автор: Александр
  • Администратор
  • Александр
  • Зарегистрирован: 2011-06-01
  • Приглашений: 0
  • Сообщений: 189
  • Уважение: +1
  • Позитив: 0
  • Провел на форуме:
    1 день 15 часов
  • Последний визит:
    2014-01-21 19:45:06

Другой вариант
http://s7.uploads.ru/t/dBo8a.png

<!-- Всплывающее окно с персональными ссылками профиля -->
<script type="text/javascript">
$(document).ready(function(){
$('#pun-viewtopic div.post').each(function(){
var purl = $(this).find('.pl-email:first a').attr('href');
var pem = $(this).find('.pl-email:last a').attr('href');
var pls = purl.slice(purl.indexOf('id=')+3);var pweb = $(this).find(".post-links ul li.pl-website a");
var pwu = pweb.attr("href");
$(this).find("div.post-author .pa-author a").after(" <span style='cursor:pointer;color:#873F01;' title='Персональные ссылки' class='vprofo open'>▼</span><div class='viewp' style='color: rgb(153, 153, 153);display: block;position: absolute;margin-left:20px!important;width:auto;padding:5px 8px 5px 8px;background:#FFFCE5; border:double 3px #B38000;border-radius:5px;box-shadow:inset 0 0 2em #E5B94C; font-family:Georgia;font-weight:normal'><a href='"+purl+"'><img src='ссылка на иконку Профиль' border='0'/> Посмотреть профиль</a><br /><a href='http://ссылка на ваш форум/messages.php?action=new&uid="+pls+"'><img src='ссылка на иконку ЛС' border='0'/> Написать ЛС</a><br><a href='"+pem+"'><img src='ссылка на иконку E-mail' border='0'/> Написать E-mail</a><fweb><br><a href='"+pwu+"'><img src='ссылка на иконку Веб-сайт' border='0'/> Веб-сайт</a></fweb></div>");
if(pweb.length){}else {$(this).find("fweb").replaceWith(" ");}
$(".viewp, .pl-email, .pl-website").hide();
$(this).find("div.post-author .pa-author .vprofo").click(function () {
$(this).toggleClass("open").toggleClass("close").next().toggle()});});});</script>

0

Страница: 1

Вы здесь » MUSIC LIFE » Мастерская дизайна » Всплывающее окно с персональными ссылками профиля