Contexte :
Récemment, lors de l'écriture d'un projet de compte public, j'ai rencontré le besoin de générer dynamiquement un menu coulissant. Dans le développement Android précédent, il a été implémenté via. le package v7. Le composant est complet. Alors, comment implémenter cette fonction dans le développement de pages web ?
(Tutoriel recommandé : tutoriel HTML)
Les menus coulissants peuvent être implémentés via swiper.js.
Ce qui suit doit présenter swiper.css et swiper.js.
partie html :
<div class="swiper-container"> <div class="swiper-wrapper"> <div class="swiper-slide">slider1</div> <div class="swiper-slide">slider2</div> <div class="swiper-slide">slider3</div> <div class="swiper-slide">slider3</div> <div class="swiper-slide">slider3</div> <div class="swiper-slide">slider3</div> <div class="swiper-slide">slider3</div> </div> </div>
partie js :
初始化 <script> var mySwiper = new Swiper('.swiper-container', { autoplay: true,//可选选项,自动滑动 freeMode:true,//滑动不够一格,不会自动贴合 slidesPerView:4,//设置slider容器能够同时显示的slides数量 }) </script>
Terminé !
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!