J'utilise le carrousel de hibou dans mon format HTML. Cela fonctionne bien mais ne pas afficher le bouton suivant et précédent. Ensuite, j'ai ajouté un bouton dans ma page, il ne figure toujours pas. Et j'ai également mis en œuvre de la même manière dans mon modèle de lame de Laravel, il fonctionne bien avec le prochain bouton précédent. J'ai ajouté la version 2.3.4 de Owl Carousel.
Voici mon code que j'ai fait dans mon HTML:
J'en ai ajouté des images. Dans la première photo, cela fonctionne bien avec la lame de Laravel. Et en seconde, il n'affiche pas le bouton fléchant pour les prochaines et précédentes.
Je l'ai cherché mais je n'ai pas eu de solution appropriée. Est-ce que quelqu'un sait ce qui ne va pas avec ça? Ai-je manqué quelque chose? Merci pour l'aide à l'avance. p>
3 Réponses :
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
</head>
<body>
<section class="features">
<!-- <img src="images/features -bg.jpg" alt="Fitzoh" class="features-bg"> -->
<div class="container">
<div class="row align-items-center">
<div class="col-12 col-lg-6 text-center text-lg-left">
<h6 class="text-light-green">Standout with Fitzoh</h6>
<div class="divider-sm"></div>
<h2>Take your fitness business to the next level</h2>
<p>With Fitzoh, adopting a better client experience has been made easier than ever.</p>
<a href="#" title="" class="btn btn-lg btn-primary btn-round">Know More</a>
<div class="features-list mt48 text-left">
<a href="#one" class="feature mb24 active">
<p class="mb0">Add value to your brand through your own application</p>
</a>
<a href="#two" class="feature mb24">
<p class="mb0">Enhance client experience through virtual training</p>
</a>
<a href="#three" class="feature mb24">
<p class="mb0">Create your own excercise and diet plans</p>
</a>
<a href="#four" class="feature mb24">
<p class="mb0">Easy Scheduling & performance tracking</p>
</a>
</div>
</div>
<div class="col-12 col-lg-6 text-center text-lg-right">
<div class="owl-carousel">
<div class="item" data-hash="one">
<img class="block-image" src="https://png.pngtree.com/thumb_back/fw800/20151028/pngtree-Design-Light-Texture-Wallpaper-background-photo-674871.jpg" alt="image">
</div>
<div class="item" data-hash="two">
<img class="block-image" src="https://blog.sonicwall.com/wp-content/uploads/2018/05/SNWL-image-412.jpg" alt="image">
</div>
<div class="item" data-hash="three">
<img class="block-image" src="http://www.rishtiindia.com/wp-content/uploads/2016/01/Background-Image-of-Flyer-Brochure.jpg" alt="image">
</div>
<div class="item" data-hash="four">
<img class="block-image" src="https://ane4bf-datap1.s3-eu-west-1.amazonaws.com/wmocms/s3fs-public/news/featured_media/featured-image-index.png?4t5V5QpQ.h.L2MpEUHsgfJM_lASy4dbb" alt="image">
</div>
</div>
</div>
</div>
</div>
</section>
</body>
</html>Merci pour la réponse mais ça ne marche pas !! @Ajay maurya
Je l'ai exécuté et ajouté aussi le même code dans mon code mais cela ne fonctionne pas! Les images infect ne figurent pas non plus après avoir ajouté ce code! Je suppose que cela se produit parce que quelque chose remplace le CSS ou JS du CAROUSEUR. Je ne sais pas quoi !!?
Version de sorcière Owl-Carousel Bibliothèque que vous utilisez?
J'utilise la version 2.3.4
$('.owl-carousel').owlCarousel({
loop:true,
margin:10,
nav:true,
dots:false,
responsive:{
0:{
items:1
},
600:{
items:3
},
1000:{
items:5
}
}
})
Vous souhaitez poser des questions sur Owl Carrousel et vous n'avez aucune initialisation de cela, veuillez ajouter du code de cela aussi.
OWL CAROUSEL CONFIG Utilisez
NAV: TRUE, CODE> Pour afficher la navigationJe l'ai ajouté. Ça ne fonctionne pas! @Ajay maurya
J'ai déjà ajouté tout le code de carrousel! Code @just
@Kinjalvithalani où l'initialisez-vous?
@Kinjalvithalani Assurez-vous que d'autres scripts ne causent aucun conflit, modifier les commandes de scripts. Vérifiez également la version JQuery.
Ok je vais vérifier !!