Mis on Picture-in-Picture (PiP)?

Picture-in-Picture on brauseri funktsioon, mis võimaldab teil video välja hüpata praegusest vaheleheest väikesesse ujuvasse aknasse, mis jääb kõige muule teie ekraanil peale. Saate seda liigutada kuhu tahes, suurust muuta ja jätkata vaatamist, samal ajal kui sirvisite teisi vahelehtesid, kirjutate dokumente või teete midagi muud arvutis — video jääb kogu aeg nähtavaks.

PiP on ehitatud kõigisse modernsesse töölaua brauseritesse (Chrome, Edge, Firefox, Safari) standardiseeritud veebi-API kaudu. See ei nõua pistikprogramme ega laiendusi, ja ujuv aken on täielikult operatsioonisüsteemi poolt hallatud, nii et see püsib isegi siis, kui lülitate rakenduste vahel.

Tööriista kirjeldus

See tööriist laadib mis tahes otsese video URL-i HTML5 mängijasse ja võimaldab teil seda Picture-in-Picture režiimis käivitada ühe klõpsuga. Kleepige link avalikult juurdepääsetavale videofailile, laadige see ja vajutage "Käivita Picture-in-Picture", et eraldada video ujuvasse ülekattesse aknasse.

Toetatud vormingud

Mis tahes videovorming, mida teie brauseri omane HTML5 mängija toetab:

  • MP4 (H.264 / H.265) — universaalselt toetatud
  • WebM (VP8 / VP9 / AV1) — toetatud Chrome'is, Firefoxis, Edge'is
  • OGG / OGV (Theora) — toetatud Firefoxis ja Chrome'is
  • MOV — toetatud Safari'is; piiratud tugi mujal
  • M4V — toetatud enamikus Chromium-põhistes brauserites ja Safari'is

Videofail peab olema serveeritud HTTP/HTTPS kaudu ja server peab lubama ristpäritolu taotlusi (CORS), et brauseril oleks võimalik see laadida.

Kuidas see toimib

  1. Sisestatud URL laadatakse standardse HTML5 <video> elemendi src atribuudina.
  2. Kui klõpsate "Käivita Picture-in-Picture", kutsub brauseris selle elemendi jaoks omane requestPictureInPicture() API.
  3. Brauseris eraldatakse video ujuvasse aknasse, mida hallata OS aknahaldur.
  4. Klõps "Välju Picture-in-Picture'ist" (või ujuva akna sulgemisnutikul) kutsub exitPictureInPicture() ja tagastab video mängijasse.

Funktsioonid

  • Ühe klõpsuga PiP käivitamine ja väljumine otse brauserist — laiendusi pole vaja
  • Töötab mis tahes avalikult juurdepääsetava otsese video URL-iga
  • 16:9 kuvasuhte mängija koos täielike omaste juhtimisvahenditega (esitus, paus, otsing, helitugevus, täisekraan)
  • Käivitab automaatselt esituse enne PiP-i sissenemist, nii et video ei külmuta
  • Tuvastab, kas PiP ei ole praeguses brauseris toetatud, ja kuvab selge sõnumi

Kasutamise juhtumid

  • Vaadake õpetuse videot ujuvas aknas, samal ajal kui järgite koodiredaktoris või teises brauseri vahekaardis
  • Jälgige otseülekannet või salvestatud videovoogu, samal ajal kui töötate teistes rakendustes
  • Hoidke videoviidet nähtavana, samal ajal kui redigeerite dokumente, arvutustabeleid või disainifaile

Piirangud

  • Videot majutav server peab lubama faili toomist erinevast päritolust (CORS päised nõutavad). Paljud CDN-id ja otsesed failihostid seda juba teevad; mõned ei tee.
  • PiP pole saadaval kõigis brauserites — eriti mõned mobiilsed brauserid ja vanemad töölaua versioonid ei toeta API-t.
  • Striimide esitusloendi vormingud nagu HLS (.m3u8) ja DASH (.mpd) ei ole otse toetatud; töötavad ainult progressiivse allalaadimise URL-id.

KKK

Miks video laadimine ebaõnnestub? Videot majutav server ei pruugi sisaldada Access-Control-Allow-Origin päist, mis lubab ristpäritolu laadimist, või URL võib nõuda autentimist. Proovige otsest avalikku linki videofailile.

Miks on PiP nupp keelatud? Peate esmalt laadima video, sisestades URL-i ja klõpsates "Laadi video". Nupp muutub aktiivseks, kui allikas on määratud.

Kas see töötab mobiilis? Picture-in-Picture API-l on piiratud tugi mobiilsetes brauserites. iOS-is toetab Safari PiP-i videote jaoks, kuid käitumine võib erineda. Android'is võib Chrome seda toetada sõltuvalt versioonist ja OS-i sätetest.