Иконки онлайна и оффлайна под аватаром
Страница 1 из 1
Иконки онлайна и оффлайна под аватаром
Как это выглядит (на примере 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("https://i.servimg.com/u/f27/14/67/67/89/kg13-515.png") вместо https://i.servimg.com/u/f27/14/67/67/89/kg13-515.png подставьте ссылку на Вашу кнопку Off.
В строке margin: -7px auto 0 вместо -7 указать подходящее отрицательное число (~ половина высоты иконки). Это расстояние, на которое иконка будет сдвинута вверх, на аватар.
Другие варианты кода
Полупрозрачные аватары в режиме оффлайн [все движки]
© Данный туториал создан пользователем Dana Domirani. Любая публикация этого материала без разрешения администрации help.forum2x2.ru запрещается.
Страница 1 из 1
Права доступа к этому форуму:
Вы не можете отвечать на сообщения
|
|