5 styles vidéo HTML5

Tous les attributs natifs : controls, autoplay, loop, muted, poster, preload, playsinline, controlslist, PiP, pistes textes et plus encore — intégrés avec Bootstrap 5 grille responsive.

Contrôles UI Loop / Autoplay Poster image Muted by design Picture-in-Picture

style 1 · Contrôles + poster

controls poster
Attributs : controls poster preload="metadata"
Formats : MP4 + WebM (fallback)
Détail : Interface classique avec image miniature avant lecture.

style 2 · Autoplay muted loop

autoplay muted
Attributs : autoplay muted loop playsinline preload="auto"
Usage : Vidéo de fond / héros, lecture silencieuse en continu.

style 3 · Sous-titres & track

VTT subtitles
Track : sous-titres WebVTT (anglais)
Preload : auto + crossorigin anonymous
Accessibilité : pistes de légendes intégrées.

style 4 · controlslist + restriction

nodownload nofullscreen
controlslist : "nodownload nofullscreen"
Poster : vignette personnalisée HD
contrôles : nodownload nofullscreen

style 5 · Picture-in-Picture & PiP

PiP natif
PiP support : bouton natif "Picture in picture" (navigateurs compatibles)
Départ : muted + autoplay, utilisateur peut réactiver son.
playsinline : évite fullscreen auto sur mobile.

📋 Tous les attributs de la balise <video> (HTML5)

src – source vidéo
controls – barre de contrôle
autoplay – lecture automatique
loop – répétition infinie
muted – muet par défaut
poster – image avant lecture
preload (none, metadata, auto)
playsinline – lecture inline iOS
crossorigin (anonymous, use-credentials)
controlslist (nodownload/nofullscreen/noremoteplayback)
disablePictureInPicture – désactive PiP
disableRemotePlayback – cast désactivé
height / width – dimensions
<track> – sous-titres, chapitres
Événements JS : play, pause, volumechange ...
Picture-in-Picture API supportée

Ces 5 démonstrations couvrent l'essentiel des cas d'usage : interface standard, boucle automatique muette, piste textuelle, contrôles restreints et mode picture-in-picture. Tous les attributs sont conformes aux spécifications HTML Living Standard.