1.行翻滚

顾名思义，一行行的滚动。

1-1.实现思路

主要使用animation和translationY实现。
注意：动画最后的显示会出现问题，因为如果要把最后一列滚动到第一列，底部会出现一大段空白。解决的办法是在原来的列表多添加开始的几列，作为视界的填充

1-2.代码

1
2
3
4
5
6
7
8
<style>
  .main {}
</style>
<div class="main">
  <ul>
    <li></li>
  </ul>
</div>

2.页翻滚

2-1.实现思路

2-2.代码

1

最后更新： 2023年03月15日 18:07