久久无码中文字幕_日韩精品无码一本二本三_久久精品呦女暗网_欧美一级夜夜爽_久久精品国产99久久99久久久

24
2018/11

swiper2的使用方法

發(fā)布時(shí)間:2018-11-24 09:24:06
發(fā)布者:luanqingwei
瀏覽量:
0

今天文匯軟件小編就來講一下swiper2的使用方法,swiper4與swiper2相比使用簡(jiǎn)單,但swiper4在ie8中是不支持的,為了解決swiper在ie中的兼容,小編通過查找資料,發(fā)現(xiàn)swiper4主要針對(duì)的ie10以上與移動(dòng)端中的使用,swiper2主要針對(duì)的事pc端中的使用,所以swiper2能夠更好的兼容ie10以下。

image.png

首先引入swiper2的css文件與js文件(這里推薦的是bootcdn的cdn文件)

將以下結(jié)構(gòu)放入頁(yè)面中(根據(jù)自己的項(xiàng)目調(diào)節(jié)結(jié)構(gòu)樣式)

 

    

    

         

Slide1
 

         

Slide2
 

         

Slide3
 

  

 

將以下js代碼放入到頁(yè)面中

image.png

這樣簡(jiǎn)單的swiper2就可以實(shí)現(xiàn)了。

如果想要加入分頁(yè)器需要在結(jié)構(gòu)中加入

,根據(jù)自己的需求定義分頁(yè)器的樣式。將pagination : '.pagination',加入到j(luò)s中,這樣swiper的分頁(yè)器功能就可實(shí)現(xiàn)了。

image.png

關(guān)鍵詞:
返回列表