相信大家比較心細(xì)的可以發(fā)現(xiàn)，我上一篇文章的背景與設(shè)計(jì)出具的是不同的，設(shè)計(jì)要求切換時(shí)背景圖片要和文章展示的圖片是一致的，那我們?cè)趺磳?shí)現(xiàn)呢，請(qǐng)看一下swiper的介紹。
實(shí)現(xiàn)思路無(wú)非兩種監(jiān)聽(tīng)點(diǎn)擊切換和滑動(dòng)切換，當(dāng)這兩種動(dòng)作被觸發(fā)時(shí)，改變背景圖片。
而另一種就是本片所示的方法，我們直接監(jiān)聽(tīng)索引值變化本身，方法如下圖。
在swiper的方法中有這樣一個(gè)方法，slidechane，當(dāng)索引改變就會(huì)觸發(fā)，可以用this.realIndex來(lái)獲取loop循環(huán)狀態(tài)下的索引值（如果沒(méi)有開(kāi)啟loop循環(huán)，索引值是this.activeIndex），然后我們根據(jù)索引來(lái)實(shí)現(xiàn)背景變換就無(wú)比簡(jiǎn)單了，這里說(shuō)一下我的思路。
利用定位把背景圖片防到swiper下，然后獲得索引值后利用js改變背景圖片的style。
最后，貼一下效果。
