MP3 player wanted

Classic
1

Howdy

I need a really simple - Play / Pause control only - Mp3 player that will play nicely in Foundation.

I’ve a fair few already but none either a) happy in Foundation or b) will allow me to have just a play / pause button

Any idea’s gratefully received

Thanks

2

You can get [Joe’s HTML5 Audio][1] stack and then use the following code in the page inspector and it will give you just a play and pause button,

.mejs-time-rail {display:none !important;}
.mejs-time.mejs-duration-container {display: none !important}
.mejs-button.mejs-volume-button{display:none!important;}
.mejs-horizontal-volume-slider{display:none !important;}
.mejs-time {display: none !important;}
.mejs-container {width: 26px !important;}

Of course you can adjust to suit your needs, if you want time or volume controls.
[1]: http://joeworkman.net/rapidweaver/stacks/html5-audio/

1 Like
3

Another alternative is the Player stack at Stacks4Stacks. Great player, very flexible. Should work fine in Foundation.

4

Thanks Zeebe - That really should be in the documentation ya know (hint hint)

Whats the best way to colour and resize the play / pause button? - Can it be done in CSS or should I tweak the graphic file in the stack contents?

5

Have actually started work on that as a tutorial for our docs page. The size and color of the play button can not change as they are SVG Sprites. You can color the background with this code
.mejs-container {background-color: red !important}
Hope that helps a little