Dette er del 2 af HTML5 audio introduktionsvideoen; Hvis du ikke har set det allerede, anbefaler jeg det tjekker del 1 at komme op til fart!

I dag arbejder vi på vores HTML5 lydafspiller og tilføjer nogle spændende funktionaliteter til virkelig at bringe vores HTML5-afspiller til liv. Vi bruger en metode, der involverer dataattributter, som giver mulighed for nem adgang til brugerdefinerede værdier for hvert lydelement, og det er her vores titler, kunstnere og albummer kommer ind.

Ved afslutningen af ​​denne vejledning forstår du følgende: "Tagning" dine lydelementer med brugerdefinerede dataattributter; såsom spor titel, kunstner og endda album kunst; bruger jQuery til at manipulere disse oplysninger og vise det på siden, med fleksibilitet til at style det omkring dine egne designs.

Jeg vil også demonstrere mit eksempel på afspilleren og taler igennem hvordan du kan udføre visse effekter med dine data; herunder at vise albumkunst som et blankt baggrund til din afspiller.

Har du præsenteret HTML5 lyd i et projekt? Hvordan sammenligner HTML5 lyd med ældre muligheder? Lad os vide dine tanker i kommentarerne.

Fremhævet billede / miniaturebillede, lydbillede via Shutterstock.