<分区>
要求我们推荐或查找工具、库或最喜欢的场外资源的问题对于 Stack Overflow 来说是偏离主题的，因为它们往往会吸引自以为是的答案和垃圾邮件。相反，describe the problem以及迄今为止为解决该问题所做的工作。
关闭 9 年前。
<分区>
要求我们推荐或查找工具、库或最喜欢的场外资源的问题对于 Stack Overflow 来说是偏离主题的，因为它们往往会吸引自以为是的答案和垃圾邮件。相反，describe the problem以及迄今为止为解决该问题所做的工作。
关闭 9 年前。
我正在寻找在页面加载时缓入/淡出元素的最佳方法。
我真的很喜欢它在 http://alpha.musicinfo.fi/ 上的样子当您进行搜索时，内容会滑入/淡入。
想知道他们是如何实现它的，因为它在浏览器和移动设备上运行得非常流畅。
谢谢!
最佳答案
对于最简单的动画，您需要使用 CSS3 过渡，which are supported on everything except opera mobile .
transition: top 0.2s ease-in, opacity 0.2s ease-in
-webkit-transition: top 0.2s ease-in, opacity 0.2s ease-in
opacity: 0.0;
position: relative;
top: 20px;
然后使用 javascript 或 jQuery，您可以在加载时设置新状态。
$('#element').css({opacity: 1.0, top: '0px'})
但为了获得最大的灵 active 和控制力，您需要使用 jQuery 的 .animate() 函数。然后你可以做一些像
$('#element').animate({
不透明度:'1.0'，
顶部:'0px'
}, 200)
将默认 CSS 设置为 opacity: 0;顶部:20px；position:relative；
关于javascript - CSS 淡入/缓和对页面加载的影响，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18277316/