Переливающийся ник

[Uzlovskii]

Здравствуйте. Я хотел бы узнать, как сделать такую же группу. Чтобы при переходе на профиль пользователя у него переливалась группа, а в темах и др. разделах переливался ник? IPB 3.4.6

[Zero108]

Лет 15 назад в интернете можно было найти js, который давал эффект переливания при наведении курсора мыши. Называлось Rainbow link on mouseOver или как-то так.

https://duckduckgo.com/?q=Links+rainbow+on+mouse+over&atb=v303-4__&ia=web

Изменено 13 декабря, 2021 пользователем Zero108

[Uzlovskii]

Скорее всего вы меня не так поняли) Вот такого эффекта я бы хотел добиться

 

[Mano]

Uzlovskii  в настройках группы в style вставить и прописать необходимый цвет

background: -webkit-linear-gradient(to right, #ff0000, #9932cc); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #ff0000, #9932cc); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

 

[by_ix]

 

[Donjuan]

 

А вообще, можно как то так ИЗОбразить

Спойлер

<span style="color: #fd190d;background: url(https://ruscod.su/files/groups_styles/1.gif);font-weight: bold;-webkit-text-fill-color: transparent;-webkit-background-clip: text;text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.11);background-size: cover;"

 

вернее так

Спойлер

<span style='font-weight:bold; color: #f00; text-shadow: 0px 2px 5px rgba(255,255,255,0.4); background:url(https://ruscod.su/files/groups_styles/1.gif);font-weight);'><i class="fa fa-cogs" aria-hidden="true"></i>

 

[Uzlovskii]

<span style="color: #fd190d;background: url(https://ruscod.su/files/groups_styles/1.gif);font-weight: bold;-webkit-text-fill-color: transparent;-webkit-background-clip: text;text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.11);background-size: cover;"

Это правильно, но не видно названия группы

[Uzlovskii]

Видео того, как я хочу сделать :)

https://disk.yandex.ru/i/m9-Wqwt0J7RV0A

[Donjuan]

7 минут назад, Uzlovskii сказал:

<span style="color: #fd190d;background: url(https://ruscod.su/files/groups_styles/1.gif);font-weight: bold;-webkit-text-fill-color: transparent;-webkit-background-clip: text;text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.11);background-size: cover;"

Это правильно, но не видно названия группы

Нижний второй верный)

7 минут назад, Uzlovskii сказал:

 

Видео того, как я хочу сделать

 

Так код вытащи с сайта и все

[Uzlovskii]

Да, но выглядит это примерно так: 

[Donjuan]

4 минуты назад, Uzlovskii сказал:

Да, но выглядит это примерно так: 

Отредактировать же не сложно)

5 минут назад, Uzlovskii сказал:

Да, но выглядит это примерно так: 

Кинь в лс сайт, откуда видео было 

[by_ix]

мда уж.

[Donjuan]

Лови

Спойлер

<span style='color: #fd190d; background:url(https://ruscod.su/files/groups_styles/1.gif);font-weight: bold;-webkit-text-fill-color: transparent;-webkit-background-clip: text;text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.11);background-size: cover;'></i>

 

[Exception]

В интернете полно примеров
Это в css:

.username__shine {
    background: linear-gradient(to right, #edc65c, #ff7600, #bd2828, #ed5cc7, #5c86ed, #edc65c);
    background-size: 200% auto;
    color: #edc65c;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    -webkit-animation: shine 3s linear infinite alternate;
    animation: shine 3s linear infinite alternate;
}
@-webkit-keyframes shine {
  to {
    background-position: 200% center;
  }
}
@keyframes shine {
  to {
    background-position: 200% center;
  }
}

Для нужной группы указываем форматирование:

<span class='username__shine'></span>

 

Изменено 14 декабря, 2021 пользователем ZIKURIK