1. 程式人生 > >h5用swiper結合angularjs實現手機瀏覽器左右滑動切換圖片的效果

h5用swiper結合angularjs實現手機瀏覽器左右滑動切換圖片的效果

      需求:在h5頁面中實現多圖輪播且在手機瀏覽器上要可左右滑動切換圖片,並顯示當且頁數/總頁數以提示使用者。

      實現:由於這個功能是上上週做的,已經不記得參考了哪些大神的連結,總之應該是很多個,這裡就不一一貼上了,再次感謝所有樂於分享的大神們。下面貼我的實現:

      1.1下載swiper

       swiper中文網:http://www.swiper.com.cn/ 裡面有使用方法,很詳細,基本匯入相關js就可以用了。下一個簡單的demo,然後根據自己的需求修改。

      1.2引用swiper的html頁面

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