Решено Градиентный ник,не работает

[wh26949]

Столкнулся с такой проблемой,когда пытаюсь сделать градиентный ник,он не переливается

color: yellow;
    font-weight: bold;
    text-shadow: #f00 1px 1px 10px;
    border-raduis: 8px;
    background: linear-gradient(270deg, #ff0, #ff0, #f00, #ff0, #ff0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 900% 20%;
    color: #1000f2;
    animation: AnimNic 10s ease infinite;

@keyframes AnimBanner {    0% {
        background-position: 0% 50%    }
    50% {
        background-position: 100% 50%    }
    100% {
        background-position: 0% 50%    }
}

 

[pikamonov]

в css-стиль (группы пользователя), мы добавляем только этот код;

color: yellow;
    font-weight: bold;
    text-shadow: #f00 1px 1px 10px;
    border-raduis: 8px;
    background: linear-gradient(270deg, #ff0, #ff0, #f00, #ff0, #ff0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 900% 20%;
    color: #1000f2;
    animation: AnimNic 10s ease infinite;

а уже этот код;

@keyframes AnimBanner {    0% {
        background-position: 0% 50%    }
    50% {
        background-position: 100% 50%    }
    100% {
        background-position: 0% 50%    }
}

мы вставляем в extra.less

 

[wh26949]

в css-стиль (группы пользователя), мы добавляем только этот код;

color: yellow;
    font-weight: bold;
    text-shadow: #f00 1px 1px 10px;
    border-raduis: 8px;
    background: linear-gradient(270deg, #ff0, #ff0, #f00, #ff0, #ff0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 900% 20%;
    color: #1000f2;
    animation: AnimNic 10s ease infinite;

а уже этот код;

@keyframes AnimBanner {    0% {
        background-position: 0% 50%    }
    50% {
        background-position: 100% 50%    }
    100% {
        background-position: 0% 50%    }
}

мы вставляем в extra.less

я так и сделал,просто скинул все в одно

 

[pikamonov]

font-weight: bold;
   background: linear-gradient(270deg, #ff0, #ff0, #f00, #ff0, #ff0);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
   background-size: 400% 100%;
   animation: AnimNic 10s ease infinite;

в css стиль

@keyframes AnimNic {
   0% {
       background-position: 0% 50%;
   }
   50% {
       background-position: 100% 50%;
   }
   100% {
       background-position: 0% 50%;
   }
}

в extra.less

 

[wh26949]

 

[pikamonov]

Посмотреть вложение 9480

Проверил на своем тестовом форуме, все работает. Попробуйте изменить параметр в css-стиле с;
animation: AnimNic 10s ease infinite;
на;
animation: AnimNic 3s ease infinite;
тут изменено время анимации. Должно стать быстрее.

 

[wh26949]

Проверил на своем тестовом форуме, все работает. Попробуйте изменить параметр в css-стиле с;
animation: AnimNic 10s ease infinite;
на;
animation: AnimNic 3s ease infinite;
тут изменено время анимации. Должно стать быстрее.

сделал,анимация не показывалась так и не показывается,точнее ее совсем нет

 

[pikamonov]

сделал,анимация не показывалась так и не показывается,точнее ее совсем нет

В личные сообщения форума, предоставьте ссылку на форум, и данные для входа в админ панель

Начать переписку

 

[pikamonov]

Проблема заключалась в том, что у человека отсутствовал нужный код для анимации в extra.less.