I'm working on a site that utilizes full screen background video. I have three flash videos I'd like to load into the page which would be displayed randomly on page refresh. I know you can achieve this through action script loading the movies into one main .swf, but I'm rubbish with Flash and am looking for an alternative solution.
My search so far has uncovered a method using jquery. Unfortunately my attempts to implement it have failed. I'm hoping someone more knowledgeable than myself can tell me if this technique is valid or what I'm doing wrong. Here's my code to date:
<script type="text/javascript" src="files/js/swfobject.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var sPath;
var i = Math.floor(Math.random()*2);
switch(i)
{
case 0:
sPath = "flash/homepage_video.swf";
break;
case 1:
sPath = "flash/homepage_video.swf";
break;
}
// load the flash version of the image
var so = new SWFObject(sPath, "flash-background", "100%", "100%");
so.addParam("scale", "exactFit");
so.addParam("movie", sPath); // NOTE: the sPath variable is also used here
so.addParam("quality", "high");
so.addParam("wmode", "transparent");
so.write("homeBackground");
// NOTE: The value in this call to write() MUST match the name of the
// HTML element (<div>) you're expecting the swf to show up in
});
</script>
<body>
<div id="homeBackground">
<p>This is alternative content</p>
</div>
</body>
I'm open to other suggestions that don't involve jquery (php perhaps).
Thanks.
