jquery - 如何使用 jQuery 创建文本插入效果？

Question

我希望文字慢慢“插入” document.ready。基本上，所有的字母原本是看不见的，然后慢慢地，一个一个，有条不紊地落到屏幕上，形成标题。

我尝试使用 Lettering.js 通过添加绝对位置来为每个字母设置动画，但问题是字母在屏幕中间聚集在一起。

有什么帮助吗？

Answer 1

是的，使用 jquery $.animate，例如使用 css 将标题保持在视线之外，然后在页面加载时将其重新显示。

考虑这个段落，

p{
position:absolute;
top:-50px;
}

然后你的 jquery 在 document.ready

$('p').animate({'top':'10px'})

这将逐渐将顶部属性从 -50px 增加到 10px，因此文本将慢慢滑入。您可以使用更多组合以获得更好的效果。您可以使用jquery delay 或 javascript timeout延迟它 如果您希望它只是出现，请保持其 css 显示:none，然后在 document.ready 中显示为"

$('p').show();