Features
- 🎧 Play, pause, next, and previous song controls
- 🎵 Dynamic song and artist info display
- 🖼️ Changing album cover image
- ⏱️ Progress bar with real-time updates
- 🕒 Display of current time and duration
- 📍 Clickable progress bar to seek to any part of the track
- 🎼 Automatically plays next song when the current one ends
Technologies Used
- HTML5 – Markup structure
- CSS3 – Styling and layout
- JavaScript (ES6) – Logic and interactivity
JavaScript Overview
The main logic is handled in script.js:
- Stores an array of songs with metadata (name, displayName, artist)
- Functions to play/pause music, load songs, update the UI, and handle user interaction with the progress bar
- Uses event listeners for user actions and playback updates
Key functions include:
- playSong() / pauseSong()
- loadSong(song)
- nextSong() / prevSong()
- updateProgressBar(e) / setProgressBar(e)
Let’s work together
dziyanakantsevich@gmail.com
Frontend developer
UI/UX Designer
Available worldwide