1. 首頁 > 生活 > >

輪播圖插件有哪些 前端輪播圖插件

小知識



文章插圖
輪播圖插件有哪些 前端輪播圖插件

文章插圖
輪播圖，相信大家都寫過，有的人寫輪播圖的時候經常為某些細節而困惱，所以今天就寫輪播圖聊一聊 。
【輪播圖插件有哪些 前端輪播圖插件】在以前寫輪播圖的時候，自己寫的輪播圖總有一些地方寫的不好，尤其是寫無縫輪播，當然有些寫不好的原因，還是自己的js能力有待加強，但更多的是插件選擇方式不恰當 。
在咔拉商城首頁的無縫輪播圖的敲碼中，我選擇使用的是Swiper插件，Swiper這款插件的功能還是很強大的，只需要一些簡單的配置就能完成焦點圖、選項卡、輪播圖等功能，而且不引入JQ庫，就能完成功能 。
雖然Swiper在移動端、PC端都能用，但在PC端，它不兼容IE9以下 。
那么如何使用Swiper插件寫輪播？
下載好文件后，在頁面上要引入css js 兩個文件，swiper.min.css，swiper.min.js 這個兩個文件 。
在html里寫入：
注意里的class類名不要更改，因為在引入的CSS和JS中已經寫好了 。
然后在JS中添加配置 。
這樣無縫輪播就可以實現了，箭頭和分頁的圓點，樣式可以自己修改 。
Swiper插件還有很多其他功能，自己可以去官網看，熟悉官網所有的配置，這樣才能最完美的實現自己想要的功能 。