0

我想要具有以下要求的css3动画,如果有人分享他/她的经验会很棒

我有三张图

image1.jpg:这将从底部开始动画,(image2.jpg 和 image3.jpg 应该隐藏)

image2.jpg:一旦 image1.jpg 加载,这将出现在舞台上(image3.jpg 应该隐藏)

image3.jpg:这是在 image2.jpg 之后出现的最后一张图片

感谢您的帮助

4

2 回答 2

1

像这样的东西?http://jsfiddle.net/2hSqz/3/

下面是一个动画示例:

 div { animation-name: myfirst; animation-duration: 5s; animation-timing-function: linear; animation-delay: 2s; animation-iteration-count: infinite; animation-direction: alternate; animation-play-state: running; }

@keyframes myfirst { from {background: red;} to {background: yellow;} }

为每个浏览器优化它会很棒,比如

于 2013-01-08T07:33:51.200 回答
1

我不明白你想要什么,但我正在努力帮助你,也许你想要这样。

<style>
            @keyframes move
            {
                from{top:100%}
                to{top:0}
            }
            @keyframes visible
            {
                from{opacity:0}
                to{opacity:1}
            }
            #img1{animation:move 5s; position:relative;}
            #img2{animation:visible both 3s; animation-delay:5s; opacity:0;}
            #img3{animation:visible both 3s; animation-delay:8s; opacity:0;}

        </style>

希望这是你想要的!

于 2013-01-08T08:03:59.253 回答