I'm trying to get the Image Rotator to fill a div using 100% width and height. I found this thread, http://www.jeroenwijering.com/?thread=9967, and followed AJAXs instructions (sans the js function I don't need). The player scales fine in IE but is shrunken in Safari & FF.
If I add so.addVariable('height','100%'); and so.addVariable('width','100%'); to address non-IE browsers, width appears to be 100%, but not height, and the player won't load any images.
How do I get Image Rotator to scale to fit in all modern browsers?
In IE, the rotator itself is 100% width/height but the images/controls or "display area" is confined to a much smaller space in the upper left corner. Overstretch doesn't help. Adding flashvars.width = '100%'; flashvars.height = '100%'; completely breaks the rotator in all browsers since it seems that percent is not a supported value for these flashvars.
I've seen a couple demos that are able stretch the media player full window but this technique seems to be dependant on s.addVariable("displayheight","9999"); which the rotator does not support. And no, flashvars.width = '9999'; flashvars.height = '9999'; doesn't work either. Here's the links: http://home5.inet.tele.dk/nyboe/flash/mediaplayer/fullscreenfire.htm http://home5.inet.tele.dk/nyboe/flash/mediaplayer/sizediv.htm
I welcome anyone's working example that stretches the Image Rotator 100% height/width.
@JFD - I'm having this exact problem, and have tried everything you mentioned. I'm using swfobject 2.0 and the latest mediaplayer.swf - resizes perfectly in FF, but in IE it's sizing the black flash area correctly but only playing back in the top left corner.
I'm trying to embed mediaplayer.swf, and passing it an .flv file. My latest test loads, waits two seconds, and tries to resize. It's currently breaking in FF, I don't have IE to test. The .flv file has good metadata as far as I can tell, if there anything else wrong in this doc you can see?
bc.. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head>
only the usual problem that the embedding script is right in the middle of the body of the page... a better practise is to have *all* script in the head and triggered by the onload handler -
please see the source of the minimal_but_safe demo from the demo page for an example of this http://home5.inet.tele.dk/nyboe/flash/mediaplayer/minimal_but_safe.htm http://home5.inet.tele.dk/nyboe/flash/mediaplayer (it uses the swfobject v1.5 - but the function structure would be the same)
by creating the player proper onload instead of inline - it should not be needed to wait and resize at all ! (for the sake experiment maybe also try setting width and height flashvars also)
i havent had much experience with swfobject2 yet though (waiting for v.4 to come out of beta) so im quite curious if this will do else you might have to rollback to swfobject v.1.5
Thanks for the pointers, I was about to rewrite the whole thing and start re-embedding the player after every resize!
I assumed this thread was dead but I still should have followed up with the solution. Anyhoo...
Looks like you figured it out. I ended up going the SWFObject 2.0 route because the 1.5 method wasn't satisfying IE, FF and Safari. But then I don't think I ever tried the CSS 100% height trick until I had already switched to SWFObject 2.0. It could be that 1.5 works just as well with this technique.