什么是视口控制？

视口控制是一个双滑块控制，可让您定义滚动效果的视口起点和终点。

视口是网页中用户可见的区域。此可见区域的大小因设备而异。

向下滚动时，每个元素都会从屏幕底部进入视口。当元素首次从视口底部进入视野时，这表示距离底部的百分比为 0。随着元素进一步滚动进入视野，其在视口中的位置百分比会发生变化。当元素的垂直中间位于视口中心时，其百分比为 50%。

如果视口控制设置为 0 底部和 100 顶部，则当元素首次进入屏幕底部的用户视口时运动将开始，当元素退出视口时运动将停止。

如果设置为底部 30 和顶部 65，则当元素进入并达到视口的 30％ 时运动将开始，当达到视口的 65％ 时运动将结束。

如果使用运动效果（如透明度>淡入），则效果在 0% 时会完全可见，在元素达到视口的 30% 时开始淡出，在达到 65% 时完全不可见，然后在视口的 65% 处开始淡入，直到退出视口时达到完全可见性。

淡入淡出则恰恰相反。当元素首次以 0% 进入视口时，它将被隐藏。当元素达到视口的 30% 时，它将开始淡入，变得越来越明显，直到达到 65% 的最大可见度。当达到 65% 时，它将开始淡出，直到离开视口时再次完全隐藏。