• Страница 1 из 2
  • 1
  • 2
  • »
Модератор форума: -SAM-  
Форум » Веб-разработка » Вопросы про uCoz » Скрипт топ пользователей (Есть проблема с установкой TITLE)
Скрипт топ пользователей
TiMzLeR
Четверг, 06 Октября 2016 | Сообщение 1
Оффлайн
Проверенные
Сообщений:410
Награды: 0
Здравствуйте друзья, мне очень нужна ваша помощь) по скрипту "ТОП ПОЛЬЗОВАТЕЛЕЙ" я установил а теперь хочу немного поработать ну так та то что нужно я немного сделал. Осталось только одно я как только не пробовал, брал код с одного скрипта и сувал в свой - но не как не получалось изо этого пришлось обратиться к вам. Я хочу сделать так чтобы при наведений на аватар пользователя появлялся title в нем что бы было так:



я буду вам очень благодарен если поможете.

1)Ссылка на сайт:Сайт smile

2)Код в информере:
Код
<?if($NUMBER$='1' || $NUMBER$='2' || $NUMBER$='3')?>
<?if($NUMBER$='1')?><div class="topusers">
<div class="topusers1">
<span><em class="place1"></em><i><img src="$AVATAR_URL$" alt=""></i> <u><s></s><a class="pm_list" <a href="$PROFILE_URL$">$USERNAME$</a></u> <b style="background:#0F7AF5;">+$NEWS_POSTS$</b></span>
<?endif?>
<?if($NUMBER$='2')?>
<span> <em class="place2"></em><i><img src="$AVATAR_URL$" alt=""></i> <u><s></s><a class="pm_list" href="$PROFILE_URL$">$USERNAME$</a></u> <b style="background:#04FF00;">+$NEWS_POSTS$</b></span>
<?endif?>
<?if($NUMBER$='3')?>
<span><em class="place3"></em><i><img src="$AVATAR_URL$" alt=""></i><u><s></s><a return false;" class="pm_list" href="$PROFILE_URL$">$USERNAME$</a></u><b style="background:#F51818;">+$NEWS_POSTS$</b></span></div>
</div>
<?endif?>

<?else?>
<div class="topusers2"><div class="topusers3"><center><b>$REPUTATION$</b></center></div><span><img src="$AVATAR_URL$" alt=""></span><div class="topusers4"><b>$NUMBER$</b><a class="pm_list" href="$PROFILE_URL$">$USERNAME$</a>
</div></div>
<?endif?>


3)Код CSS:
Код
.topusers {background: #AFEEEE; height: 99px; overflow: hidden; border: solid 1px #80CCFF; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding: 16px 0 5px 4px; margin-bottom: 7px;}
.topusers a, .topusers1 a {color: #080808;}
.topusers1 {margin-right: -18px;}
.topusers span {width: 65px; height: 50px; display: block; float: left; padding: 0 8px; margin: 0 14px 0 0; font-size: 13px; color: #2a2a2a; font-weight: bold;}
.topusers span i {width: 50px; height: 50px; display: block; overflow: hidden; margin-bottom: 8px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
.topusers span i img {width: 50px; min-height: 50px; border-radius: 4px;}
.topusers span .place1 {background: url(/wm_top_users/topusers1.png) no-repeat; width: 31px; height: 28px; display: block; position: absolute; margin: -13px 0 0 28px;}
.topusers span .place2 {background: url(/wm_top_users/topusers2.png) no-repeat; width: 31px; height: 28px; display: block; position: absolute; margin: -13px 0 0 28px;}
.topusers span .place3 {background: url(/wm_top_users/topusers3.png) no-repeat; width: 31px; height: 28px; display: block; position: absolute; margin: -13px 0 0 28px;}
.topusers span b {height: 18px; padding: 3px 15px 5px 15px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; color: #FFF; font-size: 12px;}
.topusers span u {display: block; overflow: hidden; text-decoration: none; width: 50px; text-align: center; margin: 0 0 7px 0;}
.topusers span u s {float: right; margin-bottom: -18px; position: relative; width: 17px; height: 18px; display: block; background: url(/img/topusers3.png) no-repeat;}
.topusers2 {padding-bottom: 2px; margin-bottom: 6px; overflow: hidden; border-bottom: solid #DEE8EB;}
.topusers2 span {width: 35px; height: 35px; display: block; overflow: hidden; float: left; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
.topusers2 span img {width: 35px; min-height: 35px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}

.topusers3 b {width: 15px; height: 20px display: block; padding-left: 5px; padding-right: 5px;  line-height: 20px; color: #FFF; font-weight: Tahoma; background: #3893FC; box-shadow: 0px 0px 8px 0px #05A8FF; border: solid 1px #F5F8FA; border-radius: 3px; margin-top: 8px; float: right; margin-right: 8px;}
.topusers4 {font-size: 13px; color: #2a2a2a; font-weight: bold; line-height: 20px; float: left; margin: 8px 0 0 3px;}
.topusers4 b {color: #FFF; background: #1E90FF; height: 20px; display: block; float: left; margin-right: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; padding: 0 6px;}


P.S Заранее спасибо wink
Прикрепления: 7595393.png (9.1 Kb)


Три вещи никогда не возвращаются обратно - время, слово, возможность. Поэтому не теряй времени, выбирай слова, не упускай возможность.
Страна: (AZ)
Kosten
Четверг, 06 Октября 2016 | Сообщение 2
Оффлайн
Администраторы
Сообщений:44267
Награды: 70
TiMzLeR, здесь нужно информер найти, который так выводит и с него взять.
Страна: (RU)
Kosten
Пятница, 07 Октября 2016 | Сообщение 3
Оффлайн
Администраторы
Сообщений:44267
Награды: 70
TiMzLeR, но сколько раз просить, чтоб изменил и поставил свое.

Прикрепления: 5861075.png (28.6 Kb)
Страна: (RU)
TiMzLeR
Пятница, 07 Октября 2016 | Сообщение 4
Оффлайн
Проверенные
Сообщений:410
Награды: 0
Kosten, Попробую,ах да я забыл про низ если честно после того как поставили я даже и забыл про это сегодня уберу smile

Три вещи никогда не возвращаются обратно - время, слово, возможность. Поэтому не теряй времени, выбирай слова, не упускай возможность.
Страна: (AZ)
TiMzLeR
Пятница, 07 Октября 2016 | Сообщение 5
Оффлайн
Проверенные
Сообщений:410
Награды: 0
Kosten, я пробывал брал с одного информера и вставлял в свой у меня все шло на перекосяк может что то не так делаю...

Три вещи никогда не возвращаются обратно - время, слово, возможность. Поэтому не теряй времени, выбирай слова, не упускай возможность.
Страна: (AZ)
Kosten
Пятница, 07 Октября 2016 | Сообщение 6
Оффлайн
Администраторы
Сообщений:44267
Награды: 70
TiMzLeR, но там не только код нужно брать и стили.
Страна: (RU)
Angerfist
Пятница, 07 Октября 2016 | Сообщение 7
Оффлайн
Vip
Сообщений:767
Награды: 21
TiMzLeR, вообще по задумке это можно реализовать с помощью hint или tooltip. Есть базовый простой способ которым пользуются все в основном, берут понравившийся хинт и подключают ко всему шаблону сайта, остаётся к обьекту подписать title="информация".
Я тут нашёл в своё время другую идею с tooltip и без нагромождений стилей, даю ссылку на сайт, пробуй применить.
Разобраться не сложно:

Если ты хочешь чтобы информация всплывала при наведении на аватар, то оборачиваем код вывода аватара в конструкцию
span class="tooltip"
Код

<span class="tooltip">Тут аватар или имя пользователя к примеру<em>Имя: Владимир<br>Файлов: 15<br>Статей: 25<br>Комментариев: 45<i></i></em></span>


Тут я не заморачивался писать операторы юкоза, просто показал для вида, и обошёлся тегом перевода строки br для ленивых.
Вот скриншот, что в итоге получается:
Прикрепления: 5497154.jpg (7.0 Kb)


No regrets
Страна: (RU)
Kosten
Пятница, 07 Октября 2016 | Сообщение 8
Оффлайн
Администраторы
Сообщений:44267
Награды: 70
TiMzLeR, для чего вообще тебе, но мне кажется это лишнее, если не считая, что есть такая фишка на сайте, здесь понимаю.
Страна: (RU)
TiMzLeR
Пятница, 07 Октября 2016 | Сообщение 9
Оффлайн
Проверенные
Сообщений:410
Награды: 0
Kosten, Нет просто хотел немного переделать) я всегда что как то переделываю, но пока только то что могу - но если вижу что уже что то сложное я опять же пытаюсь и если вижу что не получается. Увы обращаюсь к вам happy

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

Сообщение отредактировал
TiMzLeR - Пятница, 07 Октября 2016, 16:22
Страна: (AZ)
TiMzLeR
Пятница, 07 Октября 2016 | Сообщение 10
Оффлайн
Проверенные
Сообщений:410
Награды: 0
Angerfist, Да все понятно,я попробую сделать с hint и полно для ucoz...

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

Сообщение отредактировал
TiMzLeR - Пятница, 07 Октября 2016, 17:59
Страна: (AZ)
TiMzLeR
Воскресенье, 09 Октября 2016 | Сообщение 11
Оффлайн
Проверенные
Сообщений:410
Награды: 0
Angerfist, Я не как не смог поставить тот код который ты мне дал, я как только не пробовал поставил другой и по другому) а теперь хочу внятно понять как делается с "tooltip". Объясни пожалуйста вот как я сделал просмотри правильно ли я все сделал или нет, только пока у меня проблемка с верхней части информера - где 3 юзера не как не могу верно установить так та отображается но ник и номерация пользователя уходит вниз. А в нижний части пользователей, все в роде норм) только при этом не как не мог сделать пробел - ну просто как да наводишь на номерацию пользователя то тоже отображается.

Код в информер:
Код
<?if($NUMBER$='1' || $NUMBER$='2' || $NUMBER$='3')?>
<?if($NUMBER$='1')?><div class="topusers">
<div class="topusers1">
<span><a href="$PROFILE_URL$"
class="ut-ava" title="<b>Имя:</b>$USERNAME$<br/><b>Файлов:</b> $LOAD_POSTS$</br><b>Форумов:</b> $FORUM_POSTS$</br><b>Комментов:</b> $COM_POSTS$</br>"><em class="place1"></em><i><img src="$AVATAR_URL$" alt=""></i><u><s></s><a class="pm_list" href="$PROFILE_URL$">$USERNAME$</a></u> <b style="background:#0F7AF5;">+$NEWS_POSTS$</b></span>
<?endif?>
<?if($NUMBER$='2')?>
<span><a href="$PROFILE_URL$"
class="ut-ava" title="<b>Имя:</b>$USERNAME$<br/><b>Файлов:</b> $LOAD_POSTS$</br><b>Форумов:</b> $FORUM_POSTS$</br><b>Комментов:</b> $COM_POSTS$</br>"><em class="place2"></em><i><img src="$AVATAR_URL$" alt=""></i><u><s></s><a class="pm_list" href="$PROFILE_URL$">$USERNAME$</a></u> <b style="background:#04FF00;">+$NEWS_POSTS$</b></span>
<?endif?>
<?if($NUMBER$='3')?>
<span><a href="$PROFILE_URL$"
class="ut-ava" title="<b>Имя:</b>$USERNAME$<br/><b>Файлов:</b> $LOAD_POSTS$</br><b>Форумов:</b> $FORUM_POSTS$</br><b>Комментов:</b> $COM_POSTS$</br>"><em class="place3"></em><i><img src="$AVATAR_URL$" alt=""></i><u><s></s><a return false;" class="pm_list" href="$PROFILE_URL$">$USERNAME$</a></u><b style="background:#F51818;">+$NEWS_POSTS$</b></span></div>
</div>
<?endif?>

<?else?>
<div class="topusers2"><div class="topusers3"><center><b>$REPUTATION$</b></center></div><span><a href="$PROFILE_URL$"
class="ut-ava" title="<b>Имя:</b>$USERNAME$<br/><b>Файлов:</b> $LOAD_POSTS$</br><b>Форумов:</b> $FORUM_POSTS$</br><b>Комментов:</b> $COM_POSTS$</br>"><img src="$AVATAR_URL$" alt="">
</span><div class="topusers4"><b>$NUMBER$</b><a class="pm_list" href="$PROFILE_URL$">$USERNAME$</a></div></div>
<?endif?>


стили hint:
Код
#easyTooltip{  
padding:10px;  
border:1px solid #000000;  
background:#000;  
border-radius: 4px;  
-webkit-border-radius: 4px;  
-moz-border-radius: 4px;  
color: #666666;  
filter:alpha(opacity=90);  
-moz-opacity: 0.9;  
-khtml-opacity: 0.9;  
opacity: 0.9;  
z-index:1000;  
}


Код в нижнюю часть сайта:
Код
<script type="text/javascript" src="http://www.csomsk.ru/1-ucoz/pm/tooltip.js"></script>
<script>
$(document).ready(function(){$("a").easyTooltip()});$(document).ready(function(){$("img").easyTooltip()});
</script>

07a


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

Сообщение отредактировал
TiMzLeR - Воскресенье, 09 Октября 2016, 09:16
Страна: (AZ)
Angerfist
Воскресенье, 09 Октября 2016 | Сообщение 12
Оффлайн
Vip
Сообщений:767
Награды: 21
TiMzLeR, вообще для начала не пойму откуда берётся и для чего класс
Код
class="ut-ava"
, в оригинальном коде его нет и не вижу не в общей таблице стилей этот класс, ни ссылки на стиль этот) Ну да ладно...
Во вторых в коде уже есть переход в профиль
Код
<a class="pm_list" href="$PROFILE_URL$">$USERNAME$</a>
а ты дублируешь
Код
<a href="$PROFILE_URL$"
class="ut-ava" title="<b>Имя:</b>$USERNAME$<br/><b>Файлов:</b> $LOAD_POSTS$</br><b>Форумов:</b> $FORUM_POSTS$</br><b>Комментов:</b> $COM_POSTS$</br>">
.

Но при этом ты не закрываешь тегом
Код
</a>
в конце ссылку, поэтому ссылка на профиль обьединяется со всем до
Код
<a class="pm_list" href="$PROFILE_URL$">$USERNAME$</a>
и это благо что ссылка тоже на профиль)


No regrets
Страна: (RU)
TiMzLeR
Воскресенье, 09 Октября 2016 | Сообщение 13
Оффлайн
Проверенные
Сообщений:410
Награды: 0
Angerfist,Я брал со скрипта топ пользователей csomsk стоит мне убрать это
Код
class="ut-ava"
аватар пользователей моментально пропадает, и какя уберу этот код
Код
<a class="pm_list" href="$PROFILE_URL$">$USERNAME$</a>
то ник возле номераций сразу пропадает,здесь как я понял
Код
<a href="$PROFILE_URL$"
class="ut-ava" title="<b>Имя:</b>$USERNAME$<br/><b>Файлов:</b> $LOAD_POSTS$</br><b>Форумов:</b> $FORUM_POSTS$</br><b>Комментов:</b> $COM_POSTS$</br>">
поставить в конце
Код
</a>


Три вещи никогда не возвращаются обратно - время, слово, возможность. Поэтому не теряй времени, выбирай слова, не упускай возможность.
Страна: (AZ)
Angerfist
Воскресенье, 09 Октября 2016 | Сообщение 14
Оффлайн
Vip
Сообщений:767
Награды: 21
Я не говорил убирать, я просто не понимал откуда этот класс, и тот код я не говорил убирать, показывал что ты дублируешь переход в профиль.

No regrets
Страна: (RU)
TiMzLeR
Воскресенье, 09 Октября 2016 | Сообщение 15
Оффлайн
Проверенные
Сообщений:410
Награды: 0
Angerfist, упс) тут я касянул когда убрал это
Код
class="ut-ava"
после поставил так
Код
class "title"


вот поэтому аватар и пропадал 27a


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

Сообщение отредактировал
TiMzLeR - Воскресенье, 09 Октября 2016, 13:37
Страна: (AZ)
Форум » Веб-разработка » Вопросы про uCoz » Скрипт топ пользователей (Есть проблема с установкой TITLE)
  • Страница 1 из 2
  • 1
  • 2
  • »
Поиск: