From 434cd30d6968d7fb8e2d2ec31550628b9ff94b5a Mon Sep 17 00:00:00 2001 From: Yoko Harada Date: Fri, 19 Oct 2018 00:16:41 -0400 Subject: [PATCH 1/3] feat: key event, transfrom, and audio JavaScript functions were added to make audio when a key is typed. An animation was added, which worked with key down. --- 01 - JavaScript Drum Kit/index.html | 82 +++++++++++++++++++++++++++++ 1 file changed, 82 insertions(+) create mode 100644 01 - JavaScript Drum Kit/index.html diff --git a/01 - JavaScript Drum Kit/index.html b/01 - JavaScript Drum Kit/index.html new file mode 100644 index 0000000000..0776f84f11 --- /dev/null +++ b/01 - JavaScript Drum Kit/index.html @@ -0,0 +1,82 @@ + + + + + JS Drum Kit + + + + + +
+
+ A + clap +
+
+ S + hihat +
+
+ D + kick +
+
+ F + openhat +
+
+ G + boom +
+
+ H + ride +
+
+ J + snare +
+
+ K + tom +
+
+ L + tink +
+
+ + + + + + + + + + + + + + + + From d3cc5d47ede704396c56cf911a1df55cf8dc1eef Mon Sep 17 00:00:00 2001 From: Yoko Harada Date: Fri, 19 Oct 2018 15:37:02 -0400 Subject: [PATCH 2/3] feat: adds moves to hour, mins and seconds hands Using css' transform and transition features, adds hour, mins and seconds hands which move like a clock. --- 02 - JS and CSS Clock/index.html | 98 ++++++++++++++++++++++++++++++++ 1 file changed, 98 insertions(+) create mode 100644 02 - JS and CSS Clock/index.html diff --git a/02 - JS and CSS Clock/index.html b/02 - JS and CSS Clock/index.html new file mode 100644 index 0000000000..37c29ba6b2 --- /dev/null +++ b/02 - JS and CSS Clock/index.html @@ -0,0 +1,98 @@ + + + + + JS + CSS Clock + + + + +
+
+
+
+
+
+
+ + + + + + + From 057f01b8e842a03d141d0199f5549673922fbf7a Mon Sep 17 00:00:00 2001 From: Yoko Harada Date: Mon, 22 Oct 2018 14:57:01 -0400 Subject: [PATCH 3/3] feat: adds css variable to control styles Using css variables, value changes by mouse moves were added. --- 03 - CSS Variables/index.html | 75 +++++++++++++++++++++++++++++++++++ 1 file changed, 75 insertions(+) create mode 100644 03 - CSS Variables/index.html diff --git a/03 - CSS Variables/index.html b/03 - CSS Variables/index.html new file mode 100644 index 0000000000..6b832a6fc9 --- /dev/null +++ b/03 - CSS Variables/index.html @@ -0,0 +1,75 @@ + + + + + Scoped CSS Variables and JS + + +

Update CSS Variables with JS

+ +
+ + + + + + + + +
+ + + + + + + + +