HTML、CSS和JavaScript创建独特而引人注目的文字(字母&数字)雨动画效果。该动画展现出的是一系列随机字符从云朵中下落像是将文字变成雨滴从天而降，营造出与众不同的视觉效果并且增加网页吸引力

偶然间在《梦幻西游》的官网发现的动画，然后发现他使用了CSS3的帧动画，那我来可不困了，手动撸一个出来

这天刚到公司，测试同事又在群里@我： 为什么页面鼠标一滑过，布局就错乱了？ 以前是正常的啊？ 刷新后也是一样 快看看怎么回事 同时还给发了一段bug复现视频，我本地跑个例子模拟下

本文包含了众多的 html + css + canvas + js 实现的前端动画，为了以免大家复制代码出错，故提供了完整的网盘下

我正在参加「掘金·启航计划」 用CSS动画实现一个iPhone“灵动岛”。我正在参加「掘金·启航计划」

之前看到coco的这样一篇文章： 纯 CSS 实现波浪效果！，非常巧妙，通过改变border-radius和不断旋转实现的波浪效果，有兴趣的可以去研究一下。 这次尝试一下使用 CSS 渐变来实现这样一

1. 让内容始终浮动在区域的顶部 实现当屏幕滚动到一个区域时，该区域的内容始终浮动在顶部，当随着屏幕的滚动区域隐藏，浮动的内容也跟着隐藏。这里的实现方式是把需要做动画的这一个模块的高度设置的很大，内容利用position: sticky始终固定在该模块的顶部来实现。 2. 实现…