Audio Insluiten

Je kunt het <audio> element gebruiken om audiobestanden op een webpagina op te nemen. Laten we een voorbeeld bekijken:

In dit voorbeeld:

• Het <audio> element bevat een <source> element, dat de URL en het bestandstype van het audiobestand specificeert. Veelvoorkomende ondersteunde formaten zijn MP3 en OGG;
• Het controls attribuut toont standaard afspeelbedieningen zoals afspelen, pauzeren en volume;
• Als de browser van de gebruiker het audio-element niet ondersteunt, wordt een terugvalbericht weergegeven.

Aanvullende attributen die vaak worden gebruikt met het HTML-audio-element zijn:

• autoplay: start het afspelen van het audiobestand zodra de pagina wordt geladen;
• loop: zorgt ervoor dat het audiobestand continu wordt herhaald;
• muted: dempt het audio standaard;
• volume: specificeert het standaard volumeniveau voor het audiobestand, variërend van 0.0 (stil) tot 1.0 (volledig volume).

Hier is een voorbeeld dat het gebruik van al deze attributen demonstreert:

Video Insluiten

Je kunt videobestanden insluiten op een webpagina met behulp van het <video>-element. Overweeg het volgende voorbeeld:

In dit voorbeeld:

• Het <video>-element bevat een <source>-element, dat de URL en het bestandstype van het videobestand specificeert. Veel ondersteunde formaten zijn WebM, MP4 en OGG;
• Het controls-attribuut toont standaard afspeelbedieningen;
• Als de browser van de gebruiker het video-element niet ondersteunt, wordt een terugvalbericht weergegeven.

Veelgebruikte attributen voor het HTML-video-element zijn onder andere:

• autoplay: start met het afspelen van het videobestand zodra de pagina laadt;
• loop: zorgt ervoor dat het videobestand continu herhaalt;
• muted: dempt het geluid standaard;
• volume: specificeert het standaard volumeniveau voor het audiobestand, variërend van 0.0 (stil) tot 1.0 (volledig volume);
• poster: specificeert de URL van een afbeelding om weer te geven als de videominiatuur voordat de video wordt afgespeeld;
• width en height: specificeert de breedte en hoogte van de videospeler in pixels.

Hier is een voorbeeld dat het gebruik van al deze attributen demonstreert:

Opmerking

Daarnaast zijn er veel JavaScript-bibliotheken en API's beschikbaar die extra functionaliteit bieden voor het afspelen en manipuleren van videocontent op het web.