Skip to content

Latest commit

 

History

History
28 lines (20 loc) · 1.02 KB

01-drumkit.md

File metadata and controls

28 lines (20 loc) · 1.02 KB

JavaScript Drum Kit

Thoughts

This was a really good way to kick off the challenge. Right from the bat you learn some really interesting JS things (custom attributes, and the transitionend event listener come to mind). By the end of the ~30 minute lesson, you've got a fully working drumset!

Organized Notes

Raw Notes

  • Data attributes in HTML when people started making their own attributes. If you want to make up an attribute, you have to add data- before the custom attribute.
  • Event is an object full of data that describes what happened
  • Key code: number associated with that key
  • Attribute selector can be used with query selector
  • By default .play() does not let you play audio over audio files. You can use the .currentTime = 0 attribute to loop over without restraints.
  • Event listener: transitionend
  • this references what was called against it
  • Learned about:
    • Key Events
    • Playing audio
    • Transition end event
    • Animaiton end event

Useful Links

keycode.info