R1SH4BH81 / music.player

This music player, created using HTML, CSS, and JavaScript, supports MP3 and WAV formats and offers basic controls like play, pause, next, previous, and volume adjustment. It displays the current song title, artist, and album artwork, and users can easily add songs to the playlist for a customizable music experience.

Home Page:https://musicplayer81.netlify.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Music Player

This is a simple music player created with HTML, CSS, and JavaScript and some use of JSON(i guess!) .

Features

  • Plays audio files in MP3 and WAV formats
  • Provides basic controls such as play, pause, next, previous, and volume adjustment
  • Displays the current song title and artist
  • Shows the album artwork for the current song
  • Allows users to add songs to the playlist

Getting Started

  1. Clone the repository to your local machine.
  2. Open index.html in your web browser.
  3. Use the "Add Song" button to add songs to the playlist.
  4. Use the controls at the bottom of the player to play, pause, and adjust the volume of the audio.

Project Structure

music.player/
├── css/
│   ├── style.css
├── img/
│   ├── img1.jpg
│   ├── img2.jpg
│   ├── img3.jpg
│   ├── img4.jpg
├── js/
│   ├── script.js
├── songs/
│   ├── song1.mp3
│   ├── song2.mp3
│   ├── song3.mp3
├── index.html
├── README.md

The project contains four main folders:

  • css: Contains the CSS file for styling the music player.
  • img: Contains the album artwork images used in the player.
  • js: Contains the JavaScript file for controlling the player and handling user interactions.
  • songs: Contains the audio files that can be played in the player.

Technologies Used

  • HTML
  • CSS
  • JavaScript

About

This music player, created using HTML, CSS, and JavaScript, supports MP3 and WAV formats and offers basic controls like play, pause, next, previous, and volume adjustment. It displays the current song title, artist, and album artwork, and users can easily add songs to the playlist for a customizable music experience.

https://musicplayer81.netlify.app


Languages

Language:CSS 37.8%Language:SCSS 25.0%Language:HTML 22.2%Language:JavaScript 15.0%