0

我想用 CSS3 制作一个简单的框架我的框架幻灯片。

我想定义它通过每一帧的次数。例如; 第 3 帧 / 最后一帧它就停止了。

我在网上找到了很多很棒的 CSS3 动画演示；但关于逐帧幻灯片的内容并不多。

EG：我喜欢这个；http://mos.netmagazine.com/site/files/tutorials/assets/2011/08/animation_01.html——虽然在动画方面有所不同——但我觉得我可以使用@keyframes；问题是 - 我在这里尝试vvv

http://www.w3schools.com/css3/tryit.asp?filename=trycss3_animation1

这个功能正是我想要的；除了它不会让我用background:图像替换？我怎么能这样做；最后一块拼图——我怎样才能设置一个参数让它停在某个帧？

最后说明 - 这是针对 iPad 网站的。

4

1 回答 1

1

你可以很容易地用 javascript 或 jquery 来做，但你不能用 CSS3 来做。你可以这样做：

#images { width: height: }
#images img { width: height: opacity=0; transition all 5s linear; -moz-transition all 5s linear; -o-transition all 5s linear; -webkit-transition all 5s linear; } 
#images img:target { opacity=1; }

<div id="images"> <img src="pic1" id="pic1"/> <img src="pic2" id="pic2"> <img src="pic3" id="pic3"/> . . . <img src="picn" id="picn"/> </div>
<div id="list"> <a href="#pic1">1</a> <a href="#pic2">2</a> <a href="#pic3">3</a> . . . <a href="#picn">n</a> </div>
于 2012-12-11T15:24:19.870 回答