jquery自定义轮播图

jquery实现轮播图

          web网页上的首页，经常会出现轮播图。

          第三方的轮播图存在效果单一，扩展性低等问题。

        自定义录播图特点：

       1.功能全面

       2.可维护性高

       3.扩展性高

       4.易于兼容其他前端框架

      效果图:

       

       实现思路:

       1.布局

         通过叠罗汉方式将图片展示区、上一张下一张点击区，指示灯展示区层叠显示

         主画布wrap层在最低层，其次是图片展示区，上一张下一张点击区覆盖图片展示区，

         指示灯展示区覆盖图片展示区。

       2.CSS样式

        将wrap层相对布局，图片展示区、上一张下一张点击区、指示灯展示区层设置为绝对布局。

        wrap层作为包涵体，对图片展示区、上一张下一张点击区、指示灯展示区层进行层叠布局。

        通过display:flex设置盒子弹性布局对指示灯展示区层进行居中排列

        通过display:block和d