普通轮播和无缝轮播

2020-08-10  本文已影响0人  凉城十月

普通轮播

原理:将图片当作一个横向的整体,根据translateX的变化,实现左右移动。

无缝轮播

原理:将图片设为三种状态:enter、current、leave,先将第一张图片设为current,其他设为enter,动画开始后将current转成leave状态,同时将后面一张图片从enter切换到current,这个状态完成后,将leave状态的再立马切换到enter状态去等待入场。后面的动画原理相同。 无缝轮播代码.png
上一篇 下一篇

猜你喜欢

热点阅读