标题图像使用CSS进行平移 - Firefox不起作用

Question

我在以下网页的标题图像上实施了平移动画，该功能在Safari浏览器& Chrome上效果很好。我有问题得到它在Firefox上工作，我曾尝试玩-moz-和-webkit-属性，但似乎没有任何改变。

http://osealeisure.com/wordpress/osea/about/

CSS

@keyframes panning { 
    0% { 
    background-position: 0% 0%; 
    } 
    25% { 
    background-position: 100% 100%; 
    } 
    50% { 
    background-position: 100% 0%; 
    } 
    75% { 
    background-position: 0 100%; 
    } 
    200% { 
    background-position: 0 0; 
    } 
} 

@-webkit-keyframes panning { 
    0% { 
    background-position: 0% 0%; 
    } 
    25% { 
    background-position: 100% 100%; 
    } 
    50% { 
    background-position: 100% 0%; 
    } 
    75% { 
    background-position: 0 100%; 
    } 
    200% { 
    background-position: 0 0; 
    } 
} 

@-moz-keyframes panning { 
    0% { 
    background-position: 0% 0%; 
    } 
    25% { 
    background-position: 100% 100%; 
    } 
    50% { 
    background-position: 100% 0%; 
    } 
    75% { 
    background-position: 0 100%; 
    } 
    200% { 
    background-position: 0 0; 
    } 
} 

.vc_custom_1487756740420 { 
    position: relative; 
    height: 100%; 
    width: 100%; 
    background-size: 100%!important; 
    animation: panning 40s infinite linear; 
    -moz-animation: panning 40s infinite linear; 
    -webkit-animation: panning 40s infinite linear; 
} 

任何想法表示赞赏！

Answer 1

你将不得不使用Mozilla动画语法：

-moz-animation: panning 40s infinite linear;