連續的CSS轉換

Question

有沒有辦法使用CSS3轉換連續動畫背景圖像的background-position屬性？

Answer 1

是的，這是可能的 - DEMO

div 
{ 
    background: url(http://lorempixel.com/100/100); 
    height: 100px; 
    width: 100px; 

    -webkit-animation: slide 2s linear infinite; 
     -moz-animation: slide 2s linear infinite; 
      animation: slide 2s linear infinite; 
} 


@-webkit-keyframes slide 
{ 
    0% {background-position: 0 0;} 
    100% {background-position: 100px 0;} 
}​ 

@-moz-keyframes slide 
{ 
    0% {background-position: 0 0;} 
    100% {background-position: 100px 0;} 
} 

@keyframes slide 
{ 
    0% {background-position: 0 0;} 
    100% {background-position: 100px 0;} 
}