Sunbelt Computer Software

PL/B Language Development and Support

javaScript-projects/basic-projects/drumKit/index.html at dpgcode · DPG-Code/javaScript-projects · GitHub

Repository navigation

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Drum Kit</title>

<link rel="stylesheet" href="style.css">

<script src="script.js" defer></script>

</head>

<body class="center">

<div class="main center">

<div data-key="a" class="key center">a</div>

<div data-key="s" class="key center">s</div>

<div data-key="d" class="key center">d</div>

<div data-key="f" class="key center">f</div>

<div data-key="g" class="key center">g</div>

<div data-key="h" class="key center">h</div>

<div data-key="j" class="key center">j</div>

<div data-key="k" class="key center">k</div>

<div data-key="l" class="key center">l</div>

</div>

<audio data-key="a" src="sounds/01 - JavaScript Drum Kit_sounds_boom.wav"></audio>

<audio data-key="s" src="sounds/01 - JavaScript Drum Kit_sounds_clap.wav"></audio>

<audio data-key="d" src="sounds/01 - JavaScript Drum Kit_sounds_hihat.wav"></audio>

<audio data-key="f" src="sounds/01 - JavaScript Drum Kit_sounds_kick.wav"></audio>

<audio data-key="g" src="sounds/01 - JavaScript Drum Kit_sounds_openhat.wav"></audio>

<audio data-key="h" src="sounds/01 - JavaScript Drum Kit_sounds_ride.wav"></audio>

<audio data-key="j" src="sounds/01 - JavaScript Drum Kit_sounds_snare.wav"></audio>

<audio data-key="k" src="sounds/01 - JavaScript Drum Kit_sounds_tink.wav"></audio>

<audio data-key="l" src="sounds/01 - JavaScript Drum Kit_sounds_tom.wav"></audio>

</body>

</html>