/drumkit

Make the noise

Primary LanguageJavaScript

drumkit

Make the noise

index.html page:

✔Have set the title, as drum kit.

✔Linked css style file.

✔Linked the google font i preffered.

✔Set the title, as drum kit.

✔Have set a heading for my page as drum kit.

✔Created 7 buttons

✔Linked javascript file.

✔Included a footer.

style.css page:

✔Have set background color for by page and set center align.

✔Have set custom style for h1 and footer.

✔I uploaded a image for each button.

✔Have set a different styles for button when pressed.

✔Have set a custom style for drum buttons for better appeal.

script.js page:

✔Queried all buttons with class drum and stored in n.

✔I am checking if any button is clicked and storing that value in alp, and calling music and effect functions with alp as parameter.

✔Checking the same if any key is pressed in keyboard and calling the functions.

✔Music function plays the music of the key pressed(switch case is employed to check which alp is pressed).

✔Effect function adds the class to the pressed button so that effects can be added, timeout is used here to display effect for only a short time.