TouchAudio Toggles +HUD expands on our foundational audio toolset by adding a powerful heads up display with a modular design that allows you to do more than your average mp3 player.
You are able to design multiple interfaces to display your audio, and easily plug into a global HUD , or link collections to their own private HUD , in one page. This is exactly what we show you how to accomplish, with the included example files, and getting started docs.
- Cross Browser, Cross Device
- Autoplay, and other settings
- Global Sound Manager
- Encapsulated Audio Collections
- HTML5 + Flash Fallback
- Back, Pause/Play, Forward Control Buttons
- Responsive Scrub Controls
- Customize with CSS
About the HUD :
We show you how your audio can share a global HUD , while simultaneously having a localized HUD , or be entirely encapsulated from the global HUD . HUD ’s can be modularly customized by you to meet your design requirements. HUD ’s are easily styles with CSS .
Our example documentation includes an example where a localized HUD intentionally navigates through a select collection of audio, instead of the entire page.
About Touch Audio Toggles:
TouchAudio toggles include two magic bullets; the “toggle button”, and the “toggle element”.


The toggle button is dead-simple, and powerful. It plays & stops audio anywhere on the page. If one starts, it automatically stops the other. Super clean, super basic, and it gets the job done wonderfully.

The toggle element, is what allows us to make virtually any layout into an audio interface. We can turn <img> <div> <span> <p> and more into an audio library.

Both toggles are super-clean when it comes to writing natural html, and styling with css, especially when using a framework like ember, angular, or backbone.

Verified compatibility
Keep building!