Hi
I have this wonderful player used in my music web site. Since we do not have a videoclip, but would still like to see some action while playing a song, I'd like to play a short looped flash movie (or a animated gif would do the job as well) as long as a song is played.
Do I have to put my songs as flash movies and play those or is there a more elegant way? I tried to put to loop as image and it worked! Unfortunately it is running always and not only when the player plays some sound. Is it possible to synchronize the "background image" (a movie in this case) with the mp3? It should just do the same as the fake eq.
Thank you for your help.
dino
please see the [url=http://home5.inet.tele.dk/nyboe/flash/mediaplayer/overlayandlogo.htm]overlayandlogo[/url] demo (on the [url=http://home5.inet.tele.dk/nyboe/flash/mediaplayer/]demopage[/url])
above code with only the overlay and no logo change:
<html><head>
<style type=text/css>
#placeholder { position:absolute; left:100px; top:100px; z-index:1; }
#overlay { position:absolute; left:100px; top:100px; width:300px; height:220px; z-index:2; }
</style>
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
var currentState;
var currentItem;
function getUpdate(typ,pr1,pr2,swf) {
if(typ == "state") { currentState = pr1; showOverlay(100); }
else if(typ == "item") { currentItem = pr1; setTimeout("getItemData(currentItem)",100); }
};
function getItemData(idx) {
var obj = thisMovie("playerID").itemData(idx);
if ((obj["description"] != "#")&&(currentState != 0)) {
setOverlay(obj["description"]);
} else {
setOverlay("blank.png");
}
};
function thisMovie(movieName) {
if(navigator.appName.indexOf("Microsoft") != -1) {
return window[movieName];
} else {
return document[movieName];
}
};
function setOverlay(theOverlay) {
var tmp = document.getElementById("theOverlayImg");
if (tmp) {
if (tmp.src != theOverlay) {
tmp.src = theOverlay;
}
}
}
function showOverlay(ovlTop) {
var tmp = document.getElementById("overlay");
if (tmp) {
if (currentState != 2) { //hide overlay outside screen
tmp.style.top = -999+"px";
} else {
tmp.style.top = ovlTop+"px";
}
}
}
function createPlayer(theFile) {
var s1 = new SWFObject("mediaplayer.swf","playerID","300","320","7");
s1.addParam("allowfullscreen","false");
s1.addParam("allowscriptaccess","always");
s1.addParam("wmode","opaque");
s1.addVariable("usefullscreen", "false");
s1.addVariable("file", theFile);
s1.addVariable("width", "300");
s1.addVariable("height", "320");
s1.addVariable("displayheight", "220");
s1.addVariable("overstretch", "fit");
s1.addVariable("shuffle", "false");
s1.addVariable("showicons", "false");
s1.addVariable("enablejs","true");
s1.addVariable("javascriptid","playerID");
s1.write("placeholder");
}
</script>
</head>
<body onLoad="createPlayer('playlist.xml');">
<div id="placeholder"><a href="http://www.macromedia.com/go/getflashplayer">Get flash</a> to see this player.</div>
<div id="overlay">
<table width="300" height="220" border="0">
<tr><td align="center" valign="bottom"><img id="theOverlayImg" src="blank.png"></td></tr>
</table>
</div>
</body>
</html>