<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery.jplayer.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#jquery_jplayer").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
mp3: "/Music/MUSICFILE.mp3"
}).jPlayer("play");
var click = document.ontouchstart === undefined ? 'click' : 'touchstart';
var kickoff = function () {
$("#jquery_jplayer").jPlayer("play");
document.documentElement.removeEventListener(click, kickoff, true);
};
document.documentElement.addEventListener(click, kickoff, true);
},
ended: function () {
$(this).jPlayer("play");
},
swfPath: "/Scripts"
});
});
</script>
<style type="text/css">
#jquery_jplayer {
width:0px;
height:0px;
}
</style>
</head>
<body>
<div id="jquery_jplayer"></div>
<a href="javascript:void(0)" onclick="$('#jquery_jplayer').jPlayer('play')">on</a>
<a href="javascript:void(0)" onclick="$('#jquery_jplayer').jPlayer('pause')">off</a>
</body>
</html>