Qu'est-ce que Picture-in-Picture (PiP) ?

Picture-in-Picture est une fonctionnalité du navigateur qui vous permet de détacher une vidéo de l'onglet actuel dans une petite fenêtre flottante qui reste au-dessus de tout le reste de votre écran. Vous pouvez la déplacer n'importe où, la redimensionner et continuer à regarder tout en naviguant dans d'autres onglets, en rédigeant des documents ou en faisant autre chose sur votre ordinateur — la vidéo reste visible tout le temps.

PiP est intégré dans tous les navigateurs de bureau modernes (Chrome, Edge, Firefox, Safari) via une API web standardisée. Il ne nécessite aucun plugin ou extension, et la fenêtre flottante est entièrement gérée par le système d'exploitation, elle persiste donc même lorsque vous basculez entre les applications.

Description de l'outil

Cet outil charge n'importe quelle URL vidéo directe dans un lecteur HTML5 et vous permet de la lancer en mode Picture-in-Picture en un seul clic. Collez un lien vers un fichier vidéo accessible publiquement, chargez-le et appuyez sur « Lancer Picture-in-Picture » pour détacher la vidéo dans une fenêtre de superposition flottante.

Formats supportés

Tout format vidéo supporté par le lecteur HTML5 natif de votre navigateur :

  • MP4 (H.264 / H.265) — universellement supporté
  • WebM (VP8 / VP9 / AV1) — supporté dans Chrome, Firefox, Edge
  • OGG / OGV (Theora) — supporté dans Firefox et Chrome
  • MOV — supporté dans Safari ; support limité ailleurs
  • M4V — supporté dans la plupart des navigateurs basés sur Chromium et Safari

Le fichier vidéo doit être servi via HTTP/HTTPS et le serveur doit autoriser les requêtes cross-origin (CORS) pour que le navigateur puisse le charger.

Comment ça fonctionne

  1. L'URL que vous entrez est chargée comme src d'un élément HTML5 <video> standard.
  2. Lorsque vous cliquez sur « Lancer Picture-in-Picture », le navigateur appelle l'API native requestPictureInPicture() sur cet élément.
  3. Le navigateur détache la vidéo dans une fenêtre flottante gérée par le gestionnaire de fenêtres du système d'exploitation.
  4. Cliquer sur « Quitter Picture-in-Picture » (ou le bouton de fermeture sur la fenêtre flottante) appelle exitPictureInPicture() et ramène la vidéo au lecteur.

Fonctionnalités

  • Lancement et fermeture de PiP en un clic directement depuis le navigateur — aucune extension nécessaire
  • Fonctionne avec n'importe quelle URL vidéo directe accessible publiquement
  • Lecteur au format 16:9 avec tous les contrôles natifs (lecture, pause, déplacement, volume, plein écran)
  • Démarre automatiquement la lecture avant d'entrer en PiP pour que la vidéo ne soit pas figée
  • Détecte si PiP n'est pas supporté dans le navigateur actuel et affiche un message clair

Cas d'usage

  • Regarder une vidéo tutorielle dans une fenêtre flottante tout en suivant dans un éditeur de code ou un autre onglet du navigateur
  • Surveiller un flux en direct ou un flux vidéo enregistré tout en travaillant dans d'autres applications
  • Garder une vidéo de référence visible tout en modifiant des documents, des feuilles de calcul ou des fichiers de conception

Limitations

  • Le serveur vidéo doit autoriser le fichier à être récupéré depuis une origine différente (en-têtes CORS requis). De nombreux CDN et hôtes de fichiers directs le font déjà ; certains ne le font pas.
  • PiP n'est pas disponible dans tous les navigateurs — notamment certains navigateurs mobiles et les anciennes versions de bureau ne supportent pas l'API.
  • Les formats de playlist de streaming tels que HLS (.m3u8) et DASH (.mpd) ne sont pas directement supportés ; seules les URL de téléchargement progressif fonctionnent.

FAQ

Pourquoi la vidéo ne se charge pas ? Le serveur hébergeant la vidéo peut ne pas inclure l'en-tête Access-Control-Allow-Origin qui permet le chargement cross-origin, ou l'URL peut nécessiter une authentification. Essayez un lien direct public vers un fichier vidéo.

Pourquoi le bouton PiP est-il désactivé ? Vous devez d'abord charger une vidéo en entrant une URL et en cliquant sur « Charger la vidéo ». Le bouton devient actif une fois qu'une source est définie.

Cela fonctionne-t-il sur mobile ? L'API Picture-in-Picture a un support limité sur les navigateurs mobiles. Sur iOS, Safari supporte PiP pour les vidéos mais le comportement peut différer. Sur Android, Chrome peut le supporter selon la version et les paramètres du système d'exploitation.