在滚动时为css更改添加动画答案

【问题标题】：Add animation to css change on scroll在滚动时为css更改添加动画
【发布时间】：2015-02-05 14:27:04
【问题描述】：

我已经建立了以下页面：

Code visible at jsfiddle

当滚动时，标题会降低其高度，并且文本和徽标会改变它们的位置和大小，就像现在在许多网站上看到的那样。我想在滚动过程中添加动画。我怎样才能做到这一点？我对 JavaScript 的了解非常少，但实际上我认为动画已经在那里了。但正如你所见，状态相互跳转，没有视觉转换。

或者你可以推荐一个比我使用的更好的脚本？

希望有人可以提供帮助:-)

最好的

日

【问题讨论】：

标签： javascript css animation scroll

【解决方案1】：

您应该在.large/.small 类切换时更改的元素上启用转换

#header header,
#logo, 
#slogan{
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition:all 0.4s;
}

http://jsfiddle.net/czLo0t6n/2/的演示

【讨论】：

谢谢。这太容易了，我一直在弄乱 JS。 :-D