Fatal编程技术网
  • css/
  • 连续CSS转换

连续CSS转换

css

连续CSS转换,css,css-transitions,Css,Css Transitions,是否有一种方法可以使用CSS3转换连续设置背景图像的背景位置属性的动画？是的，可能- div { 背景：url(http://lorempixel.com/100/100); 高度：100px； 宽度：100px； -webkit动画：幻灯片2线性无限； -moz动画：幻灯片2s线性无限； 动画：幻灯片2线性无限； } @-webkit关键帧幻灯片 { 0%{背景位置：0；} 100%{背景位置：100px 0；} }​ @-moz关键帧幻灯片 { 0%{背景位置：0；} 100%{背景位置：1

是否有一种方法可以使用CSS3转换连续设置背景图像的
背景位置
属性的动画？
是的，可能-


div
{
背景：url(http://lorempixel.com/100/100);
高度：100px；
宽度：100px；
-webkit动画：幻灯片2线性无限；
-moz动画：幻灯片2s线性无限；
动画：幻灯片2线性无限；
}
@-webkit关键帧幻灯片
{
0%{背景位置：0；}
100%{背景位置：100px 0；}
}​
@-moz关键帧幻灯片
{
0%{背景位置：0；}
100%{背景位置：100px 0；}
}
@关键帧滑动
{
0%{背景位置：0；}
100%{背景位置：100px 0；}
}



​
 你是在寻找一个只支持CSS转换的解决方案，还是对CSS动画很在行？主要的想法是使用一个大背景图像作为滑块。所以我愿意接受建议。有没有办法用背景色来做这个？从红色到蓝色再到黄色持续褪色？顺便说一下，这是一个很好的例子。这应该是这里的答案op.我自己用你的代码作为基础设法弄明白了这一点：谢谢！可以用整个div来代替背景吗？或者我需要javascript吗？@ChazyChaz你可能需要JS。对于
div
-s，没有
background repeat
，因此您必须克隆
div
，并用JSYes移动它们，但最后我设法用php解决了这个问题，将变量（包含child的变量）打印两次，然后等待重复的内容到达开始，然后再次开始，它创造了一种不断变化的幻觉。