Бесплатный форум: форум поддержки
Добро пожаловать на форум поддержки сервиса Forum2x2 !

Для полноценной работы с форумом,
пожалуйста, войдите на форум под своим логином (если вы уже зарегистрированы) или же зарегистрируйтесь.


С нашей помощью вы можете создать форум,
похожий на этот!
Мы в социальных сетях

Правила форума

для обязательного прочтения!


Внимание! Важная информация для РЕГИСТРАЦИИ на форуме:

Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.
Интересные решения
Быстрый переход к сервисам: j-p-g.net Видео фоторедактор Транслит

Иконки онлайна и оффлайна под аватаром

Предыдущая тема Следующая тема Перейти вниз

Иконки онлайна и оффлайна под аватаром

Сообщение автор Dana Domirani в Сб 15 Янв - 18:47


Как это выглядит (на примере IPB)


Для начала понадобятся соответствующие иконки:


Код:
http://i27.servimg.com/u/f27/14/67/67/89/kg13-513.png


Код:
http://i27.servimg.com/u/f27/14/67/67/89/kg13-515.png

Обратите внимание: Онлайн (On) будет закрывать собой иконку оффлайна (off), поэтому должна быть либо одинакового с ней размера, либо чуть больше.




Вариант для BB2 и PUN

1) Загрузите кнопку On обычным способом: через ПА > Оформление > Управление картинками > Продвинутый режим - Кнопки - online.

2) Откройте ПА > Оформление > Шаблоны > Общие настройки - viewtopic_body (Показ темы)
Найдите в коде и удалите строку
Код:
{postrow.displayed.ONLINE_IMG}
а вместо
Код:
{postrow.displayed.POSTER_AVATAR}
подставьте
Код:
<div class="ava">{postrow.displayed.POSTER_AVATAR}</div><span class="prfav">{postrow.displayed.ONLINE_IMG}</span>
Затем сохраните и опубликуйте измененный шаблон.

3) В CSS пропишите:
Код:
.ava {
text-align: center;
}
.prfav {
display:block;
position: relative;
width: 87px;
height: 13px;
background: transparent url("http://i27.servimg.com/u/f27/14/67/67/89/kg13-515.png") no-repeat;
margin: -7px auto 0;
}
.prfav img {
display:block;
position: relative;
}
Сохраните.

В свойства:
width: 87px - подставьте ширину Вашей кнопки
height: 13px - подставьте высоту Вашей кнопки

В строке background: transparent url("http://i27.servimg.com/u/f27/14/67/67/89/kg13-515.png") вместо http://i27.servimg.com/u/f27/14/67/67/89/kg13-515.png подставьте ссылку на Вашу кнопку Off.

В строке margin: -7px auto 0 вместо -7 указать подходящее отрицательное число (~ половина высоты иконки). Это расстояние, на которое иконка будет сдвинута вверх, на аватар.





Другие варианты кода

Полупрозрачные аватары в режиме оффлайн [все движки]




© Данный туториал создан пользователем Dana Domirani.  Любая публикация этого материала без разрешения администрации help.forum2x2.ru запрещается.



Где находится CSS?
Па > Оформление > Цвета > Каскадная таблица стилей CSS


Где искать основные шаблоны?
ПА > Оформление > Шаблоны > Общие настройки


Где находится раздел для подключения скриптов
ПА > Модули > Управление кодами Javascript


avatar
Dana Domirani
Администратор
Администратор

Женщина

Сообщения : 22311
Возраст : 32
Регистрация : 2008-04-18
Благодарности : 8962

Без предупреждений

http://poltergeist-legacy.com/

Вернуться к началу Перейти вниз

Предыдущая тема Следующая тема Вернуться к началу


 
Права доступа к этому форуму:
Вы не можете отвечать на сообщения