Question

我正在尝试为“帮助窗口”创建动画。我希望它在X秒后启动或拥有图像/动画，但由于动画延迟属性在此处不适用，因为它在播放之前暂停静止图像，因此存在问题。

有关webkits或属性的任何想法可以在这里尝试吗？

见链接; http://hardystewartdesign.com/dist/project.html

    .hello {
    width: 211px;
    height: 115px;
    background: none;
    position: fixed;
    bottom: 0px;
    left: 0px;
    -webkit-animation: mymove 3s;  /* Chrome, Safari, Opera */
    -webkit-animation-iteration-count: 1;  /* Chrome, Safari, Opera */
    -webkit-animation-fill-mode: forwards;  /* Chrome, Safari, Opera */
    animation: mymove 3s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;

}
/* Chrome, Safari, Opera */
@-webkit-keyframes mymove {
    from {left: -300px;}
    to {left: 0px;}

}

@keyframes mymove {
    from {left: -300px;}
    to {left: 0;}
}

Answer 1

只需在left: 0类

中将left: -300px更改为.hello即可

创建一个在X秒后启动的CSS3动画

1 个答案: