29.轮播

作者: guidetheorient | 来源:发表于2017-06-24 20:21 被阅读0次
    1.轮播的实现原理是怎样的?如果让你来实现,你会抽象出哪些函数(or接口)供使用?

    1.使图片水平一排排列在父容器中
    2.父容器的父容器利用overflow:hidden属性,并设置固定宽度,正好使一张图片显示
    3.通过父容器left属性或margin-left调整显示的位置

    抽象出:
    showBefore()显示前一图片,
    showAfter()显示后一图,
    createBullet()改变图片数量时,生成与图片数量一致的bullet;

    2. 无限循环轮播效果

    预览
    代码

    3.渐变轮播效果

    预览
    代码

    相关文章

      网友评论

          本文标题:29.轮播

          本文链接:https://www.haomeiwen.com/subject/qjwkcxtx.html