background stretches

[tsilva83]

Hello! PLEASE HELP ME

My name is thiago, and i newbie in flash ans as3.

first.. how i do to make i site with background strech and fading photos.

like this: http://www.minus.dk/

...I want to create a background like that, where it stretches to fit the window size.

Anyone know how to scale a photo like this? please explain me with details.. like what is istance, where i need to put the code.. i found this.. but i dont understand:

Class myStage:

package {

import flash.display.Stage;
import flash.display.Sprite;
import flash.display.StageAlign;
import flash.display.StageScaleMode;
import flash.events.Event;

public class myStage extends Sprite {

private var _mc:Sprite;
private var mcStage:Stage;

public function myStage(_mc:Sprite){
this._mc = _mc;
mcStage = _mc.stage;
addStageListener();
}

public function addStageListener() {
mcStage.scaleMode = StageScaleMode.NO_SCALE;
mcStage.align = StageAlign.TOP_LEFT;
mcStage.addEventListener(Event.RESIZE, resizeHandler);
}

private function resizeHandler(event:Event):void {
trace(”stageWidth: “+mcStage.stageWidth);
trace(”stageHeight: “+mcStage.stageHeight);
_mc.x = mcStage.stageWidth/2;
_mc.y = mcStage.stageHeight/2;
}
}
}

Now, create object of myStage and pass movieclip reference (which you want to align at center of stage) as parameter:

var mystage:myStage = new myStage(_mc);

Publish the flash file. Be sure to put 100% as value for Height and Width parameters in Object and param tag in HTML.

[cancerinform]

You need to a resize eventlistener to the stage. When the stage is resized only the background image is adjusted.

[neznein9]

The trick is to detect the ratio of your stage in relationship to your image so that you always scale to the larger of the two, then just match the scale on the other axis.

Drop this into a blank fla:

stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;

//  an empty var to hold our bitmap later
var bd:Bitmap;

initialize();

function initialize():void{    
    //  load up the bitmap, when done, save it to bd and call init
    var l:Loader = new Loader();

    l.contentLoaderInfo.addEventListener(Event.COMPLETE, function(e:Event):void{
        e.target.removeEventListener(Event.COMPLETE, arguments.callee);
        trace('image loaded...');
        bd = Bitmap(e.target.content);
        stage.addChildAt(bd, 0);
        initializeStageBG();
    });
    
    l.load(new URLRequest('http://calypso88.com/tester.png'));
}

function initializeStageBG():void{
    //  listen to stage for resize
    stage.addEventListener(Event.RESIZE, onStageResize);
    onStageResize(null);  //  call onstageresize to set up the first time    
}

function onStageResize(e:Event):void{
    // when stage changes size, rescale
    const stageRatio:Number = stage.stageWidth / stage.stageHeight;
    const imgRatio:Number = bd.width / bd.height;
    
    if(imgRatio > stageRatio){
        //  img is wider than stage
        bd.height = stage.stageHeight;
        bd.scaleX = bd.scaleY;
    } else {
        //  img is taller than stage
        bd.width = stage.stageWidth;
        bd.scaleY = bd.scaleX;
    }    
}