(作者:黃啟浩 撰寫時間:2019.02.01)
各位IT小白們,在你們做輪播的時候,想做一個漸隐式的輪播非得靠插件來呢?既然這樣。小編就教小白抛開輪播插件,簡 單js就能夠有漸隐式的效果,而且非常地流暢不卡頓。思路很簡單,通過設定圖檔的透明度,并且通過透明度來切換圖檔的顯示與隐藏。
先來吃圖:
在這裡,小編用定位将圖檔重疊在imgBox裡,然後使第一張圖檔顯示,其餘圖檔隐藏,就是使第一張圖檔透明度為1,其餘圖檔透明度為0。(show類為不透明)
好了,來看js部分:
下一張切換按鈕代碼,判斷圖檔位置,是圖檔循環切換,然後每切換一次就加上show類,去掉前一張的類,周而複始。
感謝大家的浏覽,如有疑問可在評論留言哦!