h5用swiper结合angularjs实现手机浏览器左右滑动切换图片的效果

      需求：在h5页面中实现多图轮播且在手机浏览器上要可左右滑动切换图片，并显示当且页数/总页数以提示用户。

      实现：由于这个功能是上上周做的，已经不记得参考了哪些大神的链接，总之应该是很多个，这里就不一一贴上了，再次感谢所有乐于分享的大神们。下面贴我的实现：

      1.1下载swiper

       swiper中文网：http://www.swiper.com.cn/ 里面有使用方法，很详细，基本导入相关js就可以用了。下一个简单的demo,然后根据自己的需求修改。

      1.2引用swiper的html页面

     

 href="css/ncss2.css?v=2.1.0" rel="stylesheet" type="text/css" />
     href="css/thickbox.css" rel="stylesheet" type="text/css" />
     href="css/bl.css?v=2.1.1" rel="stylesheet" type="text/css" />

     rel="stylesheet" href="css/swiper.min.css">

    
    
    

    

{{$index+1}}/{{detail.pictures.length}}