HTML -zelfstudie

HTML HOME HTML-introductie HTML-editors HTML basis HTML-elementen HTML-kenmerken HTML-koppen HTML-alinea's HTML-stijlen HTML-opmaak HTML-citaten HTML-opmerkingen HTML-kleuren HTML-CSS HTML-links HTML-afbeeldingen HTML-favicon HTML-tabellen HTML-lijsten HTML-blok en inline HTML-klassen HTML-ID HTML-iframes HTML-JavaScript Paden voor HTML-bestanden HTML-kop HTML-indeling HTML-responsief HTML-computercode HTML-semantiek HTML-stijlgids HTML-entiteiten HTML-symbolen HTML-emoji's HTML-tekenset HTML-URL-codering HTML versus XHTML

HTML -formulieren

HTML-formulieren HTML-formulierkenmerken HTML-formulierelementen HTML-invoertypen HTML-invoerkenmerken Kenmerken HTML-invoerformulier

HTML -afbeeldingen

HTML-canvas HTML-SVG

HTML- media

HTML-media HTML-video HTML-audio HTML-plug-ins HTML-YouTube

HTML API's

HTML-geolocatie HTML slepen/neerzetten HTML-webopslag HTML-webwerkers HTML-SSE

HTML- voorbeelden

HTML-voorbeelden HTML-quiz HTML-oefeningen HTML-certificaat HTML-samenvatting HTML-toegankelijkheid

HTML- verwijzingen

HTML-taglijst HTML-kenmerken Algemene HTML-kenmerken Ondersteuning voor HTML-browser HTML-gebeurtenissen HTML-kleuren HTML-canvas HTML-audio/video HTML-documenttypen HTML-tekensets HTML-URL-codering HTML-taalcodes HTTP-berichten HTTP-methoden PX naar EM-omzetter Toetsenbord sneltoetsen

HTML YouTube-video's


De eenvoudigste manier om video's in HTML af te spelen, is door YouTube te gebruiken.


Worstel je met videoformaten?

Het converteren van video's naar verschillende formaten kan moeilijk en tijdrovend zijn.

Een eenvoudigere oplossing is om YouTube de video's op uw webpagina te laten afspelen.


YouTube-video-ID

YouTube geeft een id weer (zoals tgbNymZ7vqY) wanneer je een video opslaat (of afspeelt).

U kunt deze id gebruiken en naar uw video verwijzen in de HTML-code.


Een YouTube-video afspelen in HTML

Ga als volgt te werk om uw video op een webpagina af te spelen:

  • Upload de video naar YouTube
  • Noteer de video-id
  • Definieer een <iframe>element in uw webpagina
  • Laat het srcattribuut verwijzen naar de video-URL
  • Gebruik de widthen heightattributen om de dimensie van de speler te specificeren
  • Voeg eventuele andere parameters toe aan de URL (zie hieronder)

Voorbeeld

<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY">
</iframe>

YouTube automatisch afspelen + dempen

Je kunt je video automatisch laten afspelen wanneer een gebruiker de pagina bezoekt, door deze toe te voegen autoplay=1aan de YouTube-URL. Het automatisch starten van een video is echter vervelend voor je bezoekers!

Opmerking: Chromium-browsers staan ​​autoplay in de meeste gevallen niet toe. Gedempte autoplay is echter altijd toegestaan.

Voeg mute=1daarna autoplay=1toe om je video automatisch te laten afspelen (maar gedempt).

YouTube - automatisch afspelen + gedempt

<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY?autoplay=1&mute=1">
</iframe>


YouTube-afspeellijst

Een door komma's gescheiden lijst met video's om af te spelen (naast de originele URL).


YouTube-lus

Voeg loop=1toe om je video voor altijd te laten doorlopen.

Waarde 0 (standaard): De video wordt maar één keer afgespeeld.

Waarde 1: De video wordt (voor altijd) herhaald.

YouTube - Loop

<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY?playlist=tgbNymZ7vqY&loop=1">
</iframe>

YouTube-bedieningselementen

Toevoegen controls=0om bedieningselementen niet weer te geven in de videospeler.

Waarde 0: De bedieningselementen van de speler worden niet weergegeven.

Waarde 1 (standaard): Weergave spelerbediening.

YouTube - Bediening

<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY?controls=0">
</iframe>