Music Player with Javascript

YvonneDev
3 min readOct 8, 2020

Feature:

Music Player with Javascript

Local music and album covers

Font awesome icon

Demo

CODE Github

HTML:

image-container shows the album cover.

h2 and h3 are song names and artist names.

Audio track links from folder.img/

The three DOM were grabbed from objects with Javascript events.

And the Progress duration time is calculated according to the length of the audio and current time playing.

Play controls are three icons from font awesome.

CSS:

Font imported from Google Fonts.

And set everything in the center with flex.

--

--

YvonneDev

❤️Front-end Web Development self-taught *share what I learned*