/BeatBoxJammer

Drum Under Your Key is a mini project built with HTML, CSS, and JavaScript that allows you to play drum sounds using different keys on your PC. It provides a fun and interactive way to create drum beats by simply pressing keys.

Primary LanguageHTML

BeatBoxJammer

Drum Under Your Key

Drum Under Your Key is a mini project built with HTML, CSS, and JavaScript that allows you to play drum sounds using different keys on your PC. It provides a fun and interactive way to create drum beats by simply pressing keys.

Demo

You can try out the live demo here.

Features

  • Play drum sounds by pressing keys on your PC keyboard.
  • Each key corresponds to a specific drum sound.
  • Visual feedback with animations when a key is pressed.
  • Responsive design that adapts to different screen sizes.

Technologies Used

  • HTML
  • CSS
  • JavaScript

Usage

  1. Clone the repository:

  2. Open the index.html file in your web browser.

  3. Press the keys on your PC keyboard to play the corresponding drum sounds.

Customization

You can customize the drum sounds and their corresponding keys by modifying the HTML code. Each drum sound is associated with a specific key using the data-key attribute. You can replace the audio files in the sounds folder with your own sound files, keeping the same file names.

Credits

The project was inspired by Wes Bos's JavaScript 30 Drum Kit project.

License

This project is licensed under the MIT License. See the LICENSE file for more information.

Drum Under Your Key is a mini project created using HTML, CSS, and JavaScript that lets you play drum sounds by pressing different keys on your PC keyboard. It provides a fun and interactive way to experiment with drum beats and create your own rhythms. The project features a responsive design and visual feedback through animations when a key is pressed. You can easily customize the drum sounds and their corresponding keys to fit your preferences. Give it a try and start jamming with Drum Under Your Key!

To get started, clone the repository and open the index.html file in your web browser. Press the keys on your PC keyboard to play the corresponding drum sounds. Feel free to replace the audio files in the sounds folder with your own sound files to personalize the drum sounds.

This project was inspired by Wes Bos's JavaScript 30 Drum Kit project. Special thanks to Wes Bos for his valuable resources.

Check out the live demo here.

Enjoy drumming with Drum Under Your Key!

License: MIT