The visualization will only work in Internet Explorer, and it will only work if you aren't playing a video and it should work on wmas not sure.
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
body {
text-align:center;
}
</style>
<script type="text/javascript">
<!--
function StartMeUp(){
player.url = "tc4014-v.wmv";
}
function screenfull(){
/* Check to be sure the player is playing. */
if (player.playState == 3)
player.fullScreen = 'true';
}
function ShutMeDown(){
player.controls.stop();
}
function PlayIt(what,img){
document.player.url=what;
document.getElementById('pix').innerHTML='<img src="'+img+'" width="100" height="100" alt="">';
}
//-->
</script>
</head>
<body>
<a href="s292.wma" onclick="PlayIt(this.href,'image1.jpg');return false">Jon Courson - Song</a><br>
<a href="somevideo.wmv" onclick="PlayIt(this.href,'image2.jpg');return false">Jon Courson - Video</a><br>
<span id="music">
<object id="player" name="player" width="240" height="320"
classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6"
codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701"
standby="Loading Microsoft Windows Media player components..." type="application/x-oleobject">
<param name="url" value="">
<param name="uiMode" value="full">
<param name="autoStart" value="true">
<param name="loop" value="true">
<embed type="application/x-mplayer2"
pluginspage="http://microsoft.com/windows/mediaplayer/en/download/"
showcontrols="true" uimode="full" width="240" height="320"
src="" autostart="true" loop="true">
</object><br>
</span>
<span id="pix"></span>
<input type="button" name="BtnPlay" value="PLAY" onclick="StartMeUp()">
<input type="button" name="BtnStop" value="STOP" onclick="ShutMeDown()">
<input type="button" name="Btnfull" value="FULL" onclick="screenfull()">
</body>
</html>