​   本文主要使用 CSS 实现圆环流水灯、跑马灯、加载动画效果，以及介绍了常见的几种 transform 的变形函数。

背景 最近有一个页面改版的需求，在UI走查阶段，设计师说原来的轮播组件和新版页面UI整体风格不搭，所以要换掉。 这里就涉及到两种轮播组件，一种是传统的轮播组件，一种是设计师要的那种。 传统的轮播组件，

这是一个基于原生js实现的轮播功能，支持动态配置轮播列表和设置轮播过渡动画，轮播切换时间间隔，自动播放，手动分页，向前，向后翻页，以及移动端的手势滑动切换功能

效果图普通轮播图卡片式轮播图堆叠式轮播图普通轮播图普通轮播图-演示普通轮播图-源码思路：如上图所示，假设有三张图片进行轮播，绿色区域是显示区域，其它部分都是隐藏的页面渲染时,会多选择两张图片，图中数字

事情得从前两天我的另一篇文章说起，话说当时我... 算了闲话不多扯 不过还是有识货的小伙伴嘛，其实说实在的，写一篇文章如果能帮助到一个人，我觉得就很满足。 虽然我顶着开课吧的Title，但是在掘金这个自由的平台，我的言论只代表我自己。我在团队里只是水平最菜的那一位，所以写点文章…

大家在开发过程中，或多或少都会用到轮播图之类的组件，PC和Mobile上使用 Swiper.js ，小程序上使用swiper组件等。 本文将详细讲解如何用Vue一步步实现的类似Swiper.js