Een eigen musicplayer gemaakt... Wat is jullie gedacht hierover?

http://codepen.io/anon/pen/wBaear
Ziet er goed uit zoals ik het nu zie, misschien idee om van je volume knoppen slider te maken ?
En een toggle van je play/pauze knop.
De volgende stap is om de knoppen te vullen met de symbolen van play/stop/pauze in css3. Een toggle toe te voegen en de volumeknoppen te veranderen met een kleine en grote luidspreker.
Mooi gemaakt, en werkt perfect.

maar het kan beter.

Ik denk dat je dit code beter via javascript kan genereren.


<article class="audioPlayer">
	<p id="timer" class="blackGradient">00:00</p>
	<p id="balk" class="blackGradient"><span id="move"></span></p>
	<form action="" method="post" enctype="multipart/form-data" class="blackGradient">
		<input class="blackGradient" type="button" name="volDown" id="volDown" value="Vol-" onClick="javascript:audioVolume('-');">
		<input class="blackGradient" type="button" name="pauze" id="pauze" value="Pauze" onClick="javascript:audioPauze();">
		<input class="blackGradient" type="button" name="play" id="play" value="Play" onClick="javascript:audioPlay();">
		<input class="blackGradient" type="button" name="stop" id="stop" value="Stop" onClick="javascript:audioStop();">
		<input class="blackGradient" type="button" name="volUp" id="volUp" value="Vol+" onClick="javascript:audioVolume('+');">
	</form>
	<p>Volume: <span id="volume">100</span>%</p>
    <marquee class="blackGradient" behavior="scroll" direction="left" loop="0" scrollamount="3">Jan Smit &amp; Roos Van Erkel - Sla je armen om me heen</marquee>
</article>


je kan ook DOM events gebruiken in plaats van functions.
Ziet er mooi uit, slim gedaan om volume knoppen en slider te geven.
Alles is met CSS, geen afbeeldingen
Marquee opgelost. Vervangen door keyframes

Reageren