Skip to content

Here i Create A Music Player Using Html , CSS and Javascript

Notifications You must be signed in to change notification settings

ParagUnhale1998/Music-Player

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Here i Create a Simple Music Player Watching Youtube Tutorial

Welcome to My Github Profile.
as I create a simple Music player from scratch using HTML, CSS, and JavaScript.

here Is the Simple Explaination Of this Code

  1. This code sets up an audio player interface using JavaScript to control the playback of music tracks.
  2. It defines several variables to store references to different elements on the page, such as play buttons, music names, and audio player controls.
  3. An array called musics holds information about different songs, including their names, authors, and paths.
  4. Event listeners are added to the play, previous, and next buttons to trigger functions when clicked.
  5. The togglePlayMusic function is responsible for playing or pausing the music when the play button is clicked. It toggles the play/pause icon accordingly.
  6. The changeMusic function changes the current music track when the previous or next button is clicked. It updates the player and toggles play/pause.
  7. The updatePlayer function updates the player interface with the details of the current music track, such as name, author, and source path.
  8. The timeUpdate function is called when the audio player's time is updated. It updates the current time, duration, and progress bar of the player.
  9. The formatTime function formats the time in minutes and seconds, adding a leading zero if necessary.
  10. The window.onload event is used to call the updatePlayer function when the window has finished loading.
  11. The code uses the Font Awesome library to change the play/pause icon dynamically based on the audio player's state.
  12. The code demonstrates the usage of conditional statements, event listeners, DOM manipulation, and accessing properties of the audio player object.
  13. It provides a basic implementation of an audio player with play, pause, previous, and next functionality.
  14. The code assumes that the HTML markup for the audio player and its controls is already present in the document.
  15. It showcases how to manage and update the player's UI based on the current music track and the state of the audio player.

image