Dit is deel twee van de HTML5 audio-introductievideo; als je het nog niet hebt bekeken, raad ik aan uitchecken deel een om op snelheid te komen!

Vandaag zullen we werken aan onze HTML5-audiospeler en een aantal spannende functies toevoegen om onze HTML5-speler echt tot leven te brengen. We zullen een methode gebruiken met gegevensattributen, die gemakkelijke toegang tot aangepaste waarden voor elk audio-element mogelijk maken, en dat is waar onze titels, artiesten en albumkunst vandaan komen.

Aan het einde van deze zelfstudie begrijpt u het volgende: "Tagging" van uw audio-elementen met aangepaste gegevensattributen; zoals titel van nummer, artiest en zelfs albumhoezen; met behulp van jQuery deze informatie manipuleren en weergeven op de pagina, met de flexibiliteit om het te stylen rond uw eigen ontwerpen.

Ik zal ook het voorbeeld van mijn speler laten zien en bespreken hoe bepaalde effecten met je gegevens kunnen worden bereikt; inclusief weergave van de albumhoes als een glanzende achtergrond voor uw speler.

Heb je HTML5-audio in een project opgenomen? Hoe verhoudt HTML5-audio zich tot oudere opties? Laat ons je mening weten in de reacties.

Uitgelichte afbeelding / thumbnail, geluidsbeeld via Shutterstock.