swiper轮播图

首先介绍一下swiper

Swiper是纯javascript打造的滑动特效插件，面向手机、平板电脑等移动终端。

Swiper能实现触屏焦点图、触屏Tab切换、触屏多图切换等常用效果。

Swiper开源、免费、稳定、使用简单、功能强大，是架构移动终端网站的重要选择！

应用

1.首先加载插件，需要用到的文件有swiper.min.js和swiper.min.css文件。

    ...
    


    ...
    

如果你的页面加载了jQuery.js或者zepto.js，你可以选择使用更轻便的swiper.jquery.min.js。

    ...
    


    ...
    
    

html代码

    

        
Slide 1
        
Slide 2
        
Slide 3
    
    
    

    
    
    

    

    
    
    

js代码

这里的loop要注意：设置为true 则开启loop模式。loop模式：会在原本slide前后复制若干个slide并在合适的时候切换，让Swiper看起来是循环的。
loop模式在与free模式同用时会产生抖动，因为free模式下没有复制slide的时间点。