Bootstrap - Slider qui affiche la 1ère image et le début de la 2ème

Bonjour à tous,

J'ai besoin d'un conseil concernant l'intégration d'un slider contenant des articles de blog avec bootstrap. (si possible de préférence avec un élément natif bootstrap)

J'ai vu que bootstrap possède l'élément carousel qui semble correspondre (peut être qu'il y a mieux?), mais ne souhaite pas de défilement automatique (je souhaite que le passage à l'article suivant soit déclenché par le swipe de l'utilisateur)
De plus je n'arrive pas à réaliser l'affichage que je souhaite.

En effet sur mon site en cours de construction j'ai une section contenant la preview des 3 derniers articles de blog.
Aucun problème sur desktop car j'affiche simplement les 3 previews sur la largeur disponible (donc contenu fixe. Pas de slider. Pas de swipe).
En revanche sur mobile je souhaiterais avoir l'aperçu du premier article + une partie du 2ème et pouvoir passer au deuxième via le swipe. (même principe pour l'affichage du 2ème et 3ème article ainsi que pour le swipe)

Une image vaut 1000 mots donc vous trouverez en PJ le résultat souhaité sur mobile.

N'hésitez pas si vous avez des questions.
Merci d'avance pour votre aide

Bonjour,

Tu peux utiliser le système de carrousel de Bootsrap et définir la div principale comme suit :

<div class="carousel slide" data-ride="carousel" data-type="multi" data-interval="false" id="myCarousel">

Cela va permettre d’empêcher un défilement automatique et que ce soit à l'utilisateur de faire défiler le contenu.

Tu peux aussi définir cela en javascript :

$('.carousel').carousel({
  interval: 2000
})

Tu peux retrouver les différentes options ici :
https://getbootstrap.com/docs/4.2/components/carousel/#options

En espérant avoir répondu à t'as question,
Bonne journée

Hello Vi2ual,

Merci pour ta réponse

Je ne comprends pas très bien ce que tu indiques car d'après ce que je vois:
1) L'attribut "data-interval="false"" permet de ne pas avoir de défilement automatique. Donc pourquoi indiques-tu une durée de défilement en JS juste après ?
2) Ne pas avoir de défilement automatique est très bien, mais est-ce que cela permet le défilement via le swipe de l'utilisateur mobile?
3) Qu'en est-il de la disposition particulière que je souhaite avoir ? (léger aperçu de la slide suivante sur le bord droit de l’écran lors de la consultation de la slide courante?)

Il semble que l'envoi de mon image n'a pas fonctionné dans le message initial.

La voici: