Cette fois, je vais vous présenter Swiper pour mettre en œuvre un carrousel d'images publicitaires mobiles. Quelles sont les précautions pour que Swiper mette en œuvre un carrousel d'images publicitaires mobiles. Jetons un coup d'œil. .
1. Comprend principalement des modules :
swiper : fait référence au glissement et à la commutation (l'objet coulissant entier, parfois spécifiquement fait référence au processus (transition) dans lequel le curseur avance encore après avoir été relâché jusqu'à ce qu'il s'adapte au bord)
conteneur : fait référence au conteneur (le conteneur du swiper inclut la diapositive) Collection (wrapper), pagination, bouton avant, etc.)
wrapper : fait référence à une collection contenant (des objets touchables, des zones touchables et des blocs en mouvement, qui provoqueront un déplacement avec le changement de diapositive pendant la transition)
slider : fait référence au slider (un des blocs commutés, qui peut contenir du texte, des images, des éléments html ou un autre swiper
pagination : fait référence au paginateur (indique le nombre de slides et la diapositive actuellement active) )
actif : fait référence à actif, activé (la diapositive visible (visible) est active, lorsqu'il y a plus d'une diapositive visible, celle la plus à gauche est active par défaut)
rappel : fait référence à fonction de rappel (déclenchée dans certaines circonstances)
2. Carrousel simple , comme indiqué ci-dessous :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
|
3. Autres paramètres en js :
1 2 3 4 5 6 7 8 9 10 11 12 |
|
Remarque : Avant d'utiliser swiper, vous devez introduire swiper.css, swiper.js et jQuery
Je pense que vous maîtrisez la méthode de lecture de cet article. Pour plus de passionnant, veuillez prêter attention aux autres articles connexes sur le site Web PHP chinois ! Lecture recommandée :Comment changer les boutons fléchés avec le plug-in swiper
Comment utiliser la communication des composants Vue Autobus
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!