emma welles

a lot of very cool-looking sites are using video as a background to their page (arne-carlos.com for example), and luckily it turns out it’s not that hard to implement.

first you want to set up your flash movie to be full screen using Stage.scaleMode = “noScale” (check out my earlier post on this topic here). then, you want to set up your FLV code to have it “stream”, which I don’t understand too well but I just copy and paste the following code. note that if you add the smoothing = true, the video will look a bit better when it’s scaled up.

var nc:NetConnection = new NetConnection ();
nc.connect (null);
var ns:NetStream = new NetStream (nc);
holder.vid.attachVideo (ns);
holder.vid.smoothing = true;
ns.play ("videoName.flv");

now you gotta make sure that your video is scaling with the browser window, but not distorting (unless, of course, you want to be a rebel). to do this you just gotta call a function whenever the browser is resized, and set the width and height proportionately, like this one:

function onResize (){
   var scaleY:Number = Math.round (100 * (Stage.height)
       / holder.vid._height);
   var scaleX:Number = Math.round (100 * (Stage.width)
       / holder.vid._width);
   var scaleFactor:Number = Math.max (scaleY, scaleX);
   holder._xscale = holder._yscale = scaleFactor;

}

that pretty much takes care of it. if you want some more detail and an example with code you can download, check out the awesome lessrain blog.