Question

通过使用关键帧规则的从和到关键字，可以通过指定相关元素的所需属性来声明动画。但是，来自关键字似乎期望元素的属性具有预定义值 - 我尝试过 auto ，继承，初始等无济于事。问题是我想通过指定顶部来移动元素，但我不知道初始值（可能用 js 来实现，但是我＆＃ 39;希望有不同的解决方案。）

以下是2个小提琴：

http://jsfiddle.net/v4m92/

和

http://jsfiddle.net/hExdU/

@keyframes kf {
    from {
        top: 0;
    }
    to {
        top: 10px;
    }
}

不同之处仅在于给予顶部预定义的值 - 因为可以看出动画仅在其中一个示例中起作用。有没有什么可以使另一个工作，而不用javascript计算维度和修改基础动画规则？

Answer 1

像2rror404建议的那样，你可以使用CSS变换来完成同样的事情。

@keyframes kf {
    from {
        transform: translateY(0);
   }
    to {
        transform: translateY(100px);
    }
}

（为简洁而没有浏览器前缀显示）

在关键帧规则的“from”关键字中将元素的属性设置为默认值

1 个答案: