Постепенное появление надписи

Постепенное появление надписи с помощью css
Совместимость с XenForo
XenForo 1.2
,
XenForo 1.3
,
XenForo 1.4
,
XenForo 1.5
В шаблон EXTRA.CSS добавляем:

Код:
.WidgetFramework_WidgetRenderer_Users h3 {
  width: 16.5em;
  width: 25ch;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
-moz-animation: typing 20s steps(30, end), blink-caret .5s step-end infinite alternate;
-webkit-animation: typing 20s steps(30, end), blink-caret .5s step-end infinite alternate;
-ms-animation: typing 20s steps(30, end), blink-caret .5s step-end infinite alternate;
}

@-moz-keyframes typing { from { width: 0; } }
@-moz-keyframes blink-caret { 50% { border-color: transparent; } }

@-webkit-keyframes typing { from { width: 0; } }
@-webkit-keyframes blink-caret { 50% { border-color: transparent; } }

@-ms-keyframes typing { from { width: 0; } }
@-ms-keyframes blink-caret { 50% { border-color: transparent; } }
.WidgetFramework_WidgetRenderer_Stats h3 {
  background: rgba(0, 0, 0, 0) linear-gradient(to left, #FFE4E1 50%, #f0f7fc 50%) repeat scroll left bottom / 200% 100%;
  transition: all 1s ease 0s;
}
.WidgetFramework_WidgetRenderer_Stats h3:hover {
  background-position: right bottom;
}
Класс .WidgetFramework_WidgetRenderer_Users h3 можно заменить на любой другой.

best.gif
Автор
Next
Первый выпуск
Обновление
Оценка
0.00 звёзд 0 оценок

Другие ресурсы пользователя Next

  • Elasticsearch
    Elasticsearch
    Просмотр информации об индексе ElasticSearch для администратора
  • New thread email admin
    New thread email admin
    Плагин отправит уведомление на E-mail администратору или другому члену команды о новой теме.
  • New members
    New members
    Плагин позволит команде форума увидеть информацию о новых пользователях.
  • RSS feed
    RSS feed
    Виджет RSS новостей
  • Slow query logger
    Генерация трассировки стека для медленных запросов