專題文章
時長:00:00更新時間:2020-11-27 20:50:36
1.HTML框架;如下圖,分為三個部分,首先有個div承載,然后一個ul存放圖片,一個ul存放數字,再兩個button即可。2.CSS配置;首先外框div要設置和圖片大小一致,并且居中對齊,position設置為相對定位,因為后面的圖片什么的都是相對這個大框來絕對定位的。接著設置圖片,五張圖片疊加這個通過absolute這個屬性來實現,因為上面我們把父級容器設置為relative,所以里面的子元素都是相對父級div來絕對定位的。接下來的其他元素我會用注釋寫到代碼中。效果如下:3.jquery控制輪播。實現手動輪播;意思就是鼠標移到下面數字,就顯示對應的圖片。實現自動輪播;實現點擊輪播;動態控制li數字顯示數量。通過圖片數量控制標簽數量即可。
查看詳情