html - css3 translated实现的无缝轮播图原理?
本文介绍了html - css3 translated实现的无缝轮播图原理?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
在别的网站上看到的css3 translated实现的无缝轮播图,为什么4组图片轮换的时候,要多写两个一样的轮播容器呢?这是基于什么原理???
解决方案
这是因为在播放到最后一张图的时候需要拉回到最开始那张图重新轮播,如果没有那张重复的图,给人的视觉就是直接到达第一张图,没有无缝轮播的效果,用了这张重复的图之后,到了最后一张图,给人视觉上的欺骗,直接拉回到那张重复的图,用户眼睛看到的是最后一张,实际上已经重新开始轮播了,这样做到无缝滚动。
能看得明白吗,描述的不是很清楚,希望能帮到你
这篇关于html - css3 translated实现的无缝轮播图原理?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文