Как изменить положение фона CSS только для оси X?

Я хотел бы анимировать фоновое положение некоторого div с помощью css следующим образом:

@keyframes wave{
    from{
        background-position: 80% center;
    }
    to{
        background-position: 160% center;
    }
}

Это очень простая анимация, но что произойдет, если фоновая позиция по оси Y изменится динамически? Я знаю о background-position-x и y, но...

Есть ли реальная поддержка правил background-position-x и y? Или они сегодня просто фантомы?


person Vandervals    schedule 08.06.2015    source источник


Ответы (1)


Используйте background-position-x:

@keyframes wave{
    from{
        background-position-x: 80%;
    }to{
        background-position-x: 160%;
    }
}
person Okku    schedule 08.06.2015
comment
Какова поддержка этого? Потому что это не работает на моем примере - person Vandervals; 08.06.2015
comment
Поддержка и демонстрация - person Okku; 08.06.2015
comment
Это не может быть поддержка, так как она не работает в Firefox (хотя она есть в Chrome) - person Vandervals; 08.06.2015
comment
Похоже, что Firefox не полностью поддерживает стандарт уровня 4, извините за это. возможно, вам стоит подумать об использовании JS. - person Okku; 08.06.2015