Solution au problème que le carrousel de bootstrap ne peut pas être déplacé : 1. Confirmez la version de bootstrap utilisée ; 2. Modifiez l'ordre de référencement des js et des css 3. Ajoutez l'instruction "data-ride="carousel" ; . Changez l'image du carrousel en Changez simplement l'ID pour être cohérent.
L'environnement d'exploitation de cet article : système Windows 7, bootsrap version 3.3.7, ordinateur DELL G3
Que dois-je faire si le carrousel ne peut pas bouger ?
Solution au problème que bootstrap ne peut pas carrousel :
1. Tout d'abord, lors de l'importation au début, vous devez faire attention à la version de bootstrap que vous utilisez. Le modèle exporté peut être directement recherché et copié. sur le site officiel de cette version pour éviter de l'écrire vous-même.
ps : Ne copiez jamais directement les exemples d’autres personnes et ne les importez pas.
Par exemple, concernant le modèle importé de la version bootstrap3.3.7 :
<link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet"> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery,所以必须放在前边) --> <script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script> <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 --> <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script> 此处引用的插件来自于bootstrap官网!
2. L'ordre de citation de js et css est incorrect. Il doit s'agir de css, puis de jquery.js, et enfin de bootstrap.js
Raison : bootstrap. .js doit utiliser jquery.js
3. Utilisez le composant Carousel de Bootstrap par défaut. Il vous suffit d'ajouter data-ride="carousel" pour réaliser la lecture automatique. Pas besoin d'utiliser la fonction js initialisée. Donc, si le carrousel ne démarre pas automatiquement, vérifiez d'abord cette section. D'autres paramètres peuvent être ajoutés ici, tels que le réglage de l'intervalle de temps pour la rotation de l'image.
<div id="carousel-ad" class="carousel slide" data-ride="carousel" data-interval="2000">
4. Le contenu de classe de l'étiquette dans l'image du carrousel est incohérent avec l'identifiant du conteneur div de l'image du carrousel
Par exemple : la balise li dans la liste ol, la valeur de la cible de données doit être "#carousel- exemple-générique"
car l'attribut easy id de div est : id="carousel-example-generic"
<ol class="carousel-indicators"> <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li> .....</ol>
Apprentissage recommandé : "Tutoriel d'utilisation de bootstrap"
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!