Индикатор активности пользователя (mybb)
Источник: http://forum.mybb.ru/
Сколько же картинок было придумано для аналогичного скрипта. Их минус в том, что они не выводят информацию о времени активности пользователя.
Было сделано немного иначе — при наведении на значок "Онлайн", появляется время активности пользователя на форуме. Новая версия стилизована под всплывающие подсказки, универсальна для горизонтальных профилей (независимо от местоположения строки "Активен" в Администрирование - Поля профиля).
Старая версия
Новая версия
Код:/* Индикатор активности пользователя */ .post .post-author ul { position: relative; } .pa-online { position: absolute; display: inline-block !important; top: 3px; right: 6px; background: #8db13e !important; height: 10px; width: 10px; margin: 0 0 0 -5px !important; padding: 0 !important; border: 0 !important; -webkit-transition: all .2s ease; -moz-transition: all .2s ease; transition: all .2s ease; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .pa-online:hover { background: #b3d568 !important; } .pa-online:hover strong { opacity: 1.0; visibility: visible; } .pa-online strong { position: absolute; top: 18px; right: -6px; padding: 0 8px; height: 24px; line-height: 24px; background: rgba(0, 0, 0, 0.7); font-weight: 400; white-space: nowrap; color: #fff; font-size: 90%; text-shadow: rgba(0,0,0,0.2) 0 -1px 0; text-align: center; z-index: 10; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-transition: all .2s ease; -moz-transition: all .2s ease; transition: all .2s ease; opacity: 0; visibility: hidden; } .pa-online strong:before { content: ""; position: absolute; width: 0; height: 0; right: 6px; top: -10px; border-width: 5px 5px; border-style: solid; border-color: transparent transparent rgba(0, 0, 0, 0.7) transparent; }
Меняйте позиции top и left, перемещая значок на нужное место.