Ok, I'll start from the beginning:
I am the web guy for my church website and we use Wordpress to power our sermon video podcasts. Each week we upload the sermons to blip.tv and use those links (to flash versions) to power it. In wordpress I call the .flv file from blip.tv using a link that calls for an external javascript file to pop up the sermon in a new window. You can test out the video here: http://www.summitnorthwest.org/sermonvideo/ So here's the code (taken from the most recent post--9/20/08):
In wordpress, here is the link to click on:
Here is the code between the head tags that calls the js file:
Here is the external js file:
Now here is the problem... When clicking "Play Video" in Firefox, the new window pops up nicely and opens the sermon in a flash player. The flash player/video is maximized inside the div tag so you can resize the window and in turn the video resizes with it. This works great in Firefox. However, in Safari the video shows up somewhere around 175x135 and doesn't resize at all when you resize the window.
Any ideas why?
I am the web guy for my church website and we use Wordpress to power our sermon video podcasts. Each week we upload the sermons to blip.tv and use those links (to flash versions) to power it. In wordpress I call the .flv file from blip.tv using a link that calls for an external javascript file to pop up the sermon in a new window. You can test out the video here: http://www.summitnorthwest.org/sermonvideo/ So here's the code (taken from the most recent post--9/20/08):
In wordpress, here is the link to click on:
Code:
<a href="http://blip.tv/file/get/Summitnorthwest-RonAndNancyRocky699.flv" onclick="javascript:flvplayer(this.href,'1'); return false;" target="_blank">Play Video</a>
Here is the code between the head tags that calls the js file:
Code:
<script src="http://www.summitnorthwest.org/sermons/flvplayer.js" type="text/javascript"></script>
Here is the external js file:
Code:
function flvplayer(filepath,WindowNumber)
{
PlayerWin = window.open('',WindowNumber,'width=350,height=315,top=75,left=75,screenX=75,screenY=75,resizable=1,scrollbars=0,titlebar=0,toolbar=0,menubar=0,status=0,directories=0');
PlayerWin.focus();
PlayerWin.document.writeln("<html><head><title>Video Sermon Player</title></head>");
PlayerWin.document.writeln("<body bgcolor='#000000'>");
PlayerWin.document.writeln("<div align='center'><table border='0' width='100%' height='90%'><tr><td>");
PlayerWin.document.writeln("<embed src='http://www.summitnorthwest.org/sermons/mediaplayer/player.swf' width='100%' height='100%' allowscriptaccess='always' allowfullscreen='true' flashvars='file=" + filepath + "&autostart=true&fullscreen=true&skin=http://www.summitnorthwest.org/sermons/mediaplayer/nacht_skin.swf' />");
PlayerWin.document.writeln("</td></tr></table></div>");
PlayerWin.document.writeln("<form><div align='center'><input type='button' value='Close this window' onclick='javascript:window.close();'></div></form>");
PlayerWin.document.writeln("</body></html>");
PlayerWin.document.close();
}
Now here is the problem... When clicking "Play Video" in Firefox, the new window pops up nicely and opens the sermon in a flash player. The flash player/video is maximized inside the div tag so you can resize the window and in turn the video resizes with it. This works great in Firefox. However, in Safari the video shows up somewhere around 175x135 and doesn't resize at all when you resize the window.
Any ideas why?