Simple and Clean jQuery Html5 Audio Player Plugin

Simple HTML5 Audio Player is a simple plugin that takes advantage jQuery and jQuery UI to create a clean and skinable HTML5 music player alternative to the generic browser rendered player. The plugin currently supports two types of audio: mp3 and ogg.

You may also like:

• jQuery Plugin for Fade-in and Fade-out HTML5 Audio - fadeaudio
• jQuery Plugin for Controlling and Customizing HTML5 Video/Audio - html5video
• Cross Platform HTML5 Audio & Video Player For jQuery - jPlayer
• HTML5 Audio Compatibility Layer - Audio5js
• HTML5 Video and Audio Player Plugin - MEjs

Basic Usage:

1. Include the latest jQuery and jQuery UI libraries from Google CDN

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

2. Include custom jQuery UI CSS file on your web page (jquery.ui.core.css and jquery.ui.slider.css)

<link rel="stylesheet" href="dependencies/jquery-ui-1.10.3.custom.min.css">

3. Include jQuery Simple HTML5 Audio Player Plugin on the web page

<link rel="stylesheet" href="simple-html5-music-player.css">
<script src="simple-html5-music-player.min.js" type="text/javascript"></script>

4. Create a container for the music player

<div class="audio-player" id="demo"></div>

5. The javascript

<script type="text/javascript">
$("#audio-player-1").audioPlayer({
mp3Src: "src/Test1.mp3",
oggSrc: "src/Test1.ogg",
autoPlay: false
});
</script>

---

This awesome jQuery plugin is developed by MattONeillUK. For more Advanced Usages, please check the demo page or visit the official website.