1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | < link rel = "stylesheet" href = "https://cdn.jsdelivr.net/npm/@splidejs/splide@latest/dist/css/splide.min.css" > < div class = "splide-outer" > < div class = "splide" > < div class = "splide__track" > < ul class = "splide__list" > < li class = "splide__slide" > </ li > < li class = "splide__slide" > </ li > < li class = "splide__slide" > </ li > </ ul > </ div > </ div > </ div > |
1 2 3 4 5 6 7 8 9 10 11 | html, body { margin : 0 ; padding : 0 ; } .splide-outer { max-width : 960px ; margin : auto ; } .splide__slide img { width : 100% ; } |
1 2 3 4 5 6 | document.addEventListener( 'DOMContentLoaded' , () => { new Splide( '.splide' , { type: 'loop' , pagination: false }).mount() }) |