2021-12-27 00:20:43 +00:00
|
|
|
<HTML>
|
|
|
|
|
<head>
|
|
|
|
|
<link rel = "stylesheet" href = "my-work.css">
|
|
|
|
|
<link rel = "stylesheet" href = "audio.css">
|
|
|
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
|
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
|
|
|
<link href="https://fonts.googleapis.com/css2?family=VT323&display=swap" rel="stylesheet">
|
|
|
|
|
|
|
|
|
|
<script src = "audioPlayer.js" defer></script>
|
|
|
|
|
</head>
|
|
|
|
|
<body id = "body">
|
|
|
|
|
<h1 id = "title">
|
|
|
|
|
My Work
|
|
|
|
|
</h1>
|
|
|
|
|
<div id = "audioContainer">
|
2021-12-27 00:53:51 +00:00
|
|
|
<div class = "songTitle">two trucks having sex</div>
|
2021-12-27 00:20:43 +00:00
|
|
|
<div class = "audioPlayer">
|
2021-12-27 00:53:51 +00:00
|
|
|
<audio class = "audioElement" src = "audio/twoTrucks.mp3" preload=”metadata”></audio>
|
2021-12-27 00:20:43 +00:00
|
|
|
<div class = "playButtonContainer">
|
|
|
|
|
<button class = "playButton"><img src = "images/play.png"></button>
|
|
|
|
|
</div>
|
|
|
|
|
<input type="range" class="audioSlider" max="100" value="0">
|
|
|
|
|
<span class = "timeContainer">
|
|
|
|
|
0:00
|
|
|
|
|
</span>
|
|
|
|
|
<span class = "timeSeparator">/</span>
|
|
|
|
|
<span class = "durationContainer">
|
|
|
|
|
0:00
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
|
2021-12-27 00:53:51 +00:00
|
|
|
<div class = "songTitle">goodbye horses</div>
|
2021-12-27 00:20:43 +00:00
|
|
|
<div class = "audioPlayer">
|
2021-12-27 00:53:51 +00:00
|
|
|
<audio class = "audioElement" src = "audio/goodbyeHorses.mp3" preload=”metadata”></audio>
|
2021-12-27 00:20:43 +00:00
|
|
|
<div class = "playButtonContainer">
|
|
|
|
|
<button class = "playButton"><img src = "images/play.png"></button>
|
|
|
|
|
</div>
|
|
|
|
|
<input type="range" class="audioSlider" max="100" value="0">
|
|
|
|
|
<span class = "timeContainer">
|
|
|
|
|
0:00
|
|
|
|
|
</span>
|
|
|
|
|
<span class = "timeSeparator">/</span>
|
|
|
|
|
<span class = "durationContainer">
|
|
|
|
|
0:00
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
|
2021-12-27 00:53:51 +00:00
|
|
|
<div class = "songTitle">rats birthday mixtape</div>
|
2021-12-27 00:20:43 +00:00
|
|
|
<div class = "audioPlayer">
|
2021-12-27 00:53:51 +00:00
|
|
|
<audio class = "audioElement" src = "audio/ratsBirthdayMixtape.mp3" preload=”metadata”></audio>
|
2021-12-27 00:20:43 +00:00
|
|
|
<div class = "playButtonContainer">
|
|
|
|
|
<button class = "playButton"><img src = "images/play.png"></button>
|
|
|
|
|
</div>
|
|
|
|
|
<input type="range" class="audioSlider" max="100" value="0">
|
|
|
|
|
<span class = "timeContainer">
|
|
|
|
|
0:00
|
|
|
|
|
</span>
|
|
|
|
|
<span class = "timeSeparator">/</span>
|
|
|
|
|
<span class = "durationContainer">
|
|
|
|
|
0:00
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</body>
|
|
|
|
|
</HTML>
|
