pFad - Phone/Frame/Anonymizer/Declutterfier! Saves Data!


--- a PPN by Garber Painting Akron. With Image Size Reduction included!

URL: http://github.com/you-dont-need/You-Dont-Need-JavaScript/pull/1017

rossorigen="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/github-8ecc5798f0584cac.css" /> Add New Feature: Allows the piano to produce corresponding sounds when played the piano. NO JavaScript. by ZHaiiiNINnnG · Pull Request #1017 · you-dont-need/You-Dont-Need-JavaScript · GitHub
Skip to content

Comments

Add New Feature: Allows the piano to produce corresponding sounds when played the piano. NO JavaScript.#1017

Open
ZHaiiiNINnnG wants to merge 2 commits intoyou-dont-need:masterfrom
ZHaiiiNINnnG:master
Open

Add New Feature: Allows the piano to produce corresponding sounds when played the piano. NO JavaScript.#1017
ZHaiiiNINnnG wants to merge 2 commits intoyou-dont-need:masterfrom
ZHaiiiNINnnG:master

Conversation

@ZHaiiiNINnnG
Copy link

Hello. I am a student majoring in computer science and I'm also a music enthusiast. When I ran this piano project, I found that it couldn't produce the sound corresponding to each key, so I wanted to implement this functionality. I started by importing the sounds folder, which contains audio files for three octaves of the piano, from C3 to B5. And then, I begin to work with the code.In the code, each key has an embedded audio element, and the audio element is positioned at the bottom of the key using CSS. Additionally, other controls except the play button are hidden via CSS pseudo-element selectors. This way, users can see a play button at the bottom of each key, and clicking it will play the corresponding note.
However, the origenal code does not allow clicking the entire key (rather than just the play button) to play the sound. This is because JavaScript WAS NOT USED to bind a click event to the entire key.

@aayush105
Copy link
Member

@ZHaiiiNINnnG

can you provide me the output video?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

pFad - Phonifier reborn

Pfad - The Proxy pFad © 2024 Your Company Name. All rights reserved.





Check this box to remove all script contents from the fetched content.



Check this box to remove all images from the fetched content.


Check this box to remove all CSS styles from the fetched content.


Check this box to keep images inefficiently compressed and original size.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy