如何实现webkit动画：backgroundmove

Question

我见过某种 webkit 动画类型：backgroundmove。它基本上只是在页面上滚动背景，等等。

我为基本的 -webkit-backgroundmove 动画编写了一些 css 简介，但它不起作用！我已经在 IE9/FF4/Chrome（最新）上尝试了一切。问题：是否有什么东西干扰了动画，使其无法启动？背景显示出来，但不会线性滚动，所以我猜测 -webkit-animation 存在干扰或问题

我的 css 非常基本：

div#wrapper.cloud-animation {
    background-image: url(../images/clouds.png);
    background-size: 120%;
    background-repeat: repeat-x;
    background-position: -10px 150px;
    -webkit-animation: backgroundmove infinite 50s linear;
}

我什至无法在网上找到“webkit backgroundmove”的文档，所以如果有人知道在哪里可以找到它，这将是一个很大的帮助！谢谢 -

Answer 1

backgroundmove是自定义动画，不存在，需要自己定义。

@-webkit-keyframes backgroundmove {
    from {
        background-position: left top;
    }

    to {
        background-position: right top;
    }
}

看看 https://developer.mozilla.org/en/css/css_animations