Beweglicher Hintergrund

[MH Design]

Hallo, ich möchte eine Seite mit einen beweglichen Hintergrund machen, wie bei http://www.fortminor.com/site.php
Wie geht das?

 

[Denniz]

Hier mal ein Skript welches ich mal vor einiger zeit erstellt hab.
Du mußt nur deine jpg und die größe des Ausschnittes festlegen.
Dann slidet der Hintergrund zur Maus.

stop();
Stage.scaleMode = "noScale";
Stage.align = "TL";
//------------------------
// Hier das Hintergundbild angeben das geladen werden soll
var myPicture:String = "picture.jpg";
//------------------------
var root:MovieClip = this;
var container:MovieClip = root.createEmptyMovieClip("container", root.getNextHighestDepth());
var cXPos = container._x=0;
var cYPos = container._y=0;
var runner:MovieClip = container.createEmptyMovieClip("runner", container.getNextHighestDepth());
var mask:MovieClip = container.createEmptyMovieClip("mask", container.getNextHighestDepth());
//------------------------------------------------
//Hier die größe des Ausschnittes festlegen
maskWidth = 500;
maskHeight = 300;
//---------------------------------------------------
mask.beginFill(0xFFFFFF, 100);
mask.moveTo(0, 0);
mask.lineTo(maskWidth, 0);
mask.lineTo(maskWidth, maskHeight);
mask.lineTo(0, maskHeight);
mask.lineTo(0, 0);
mask.endFill();
mask._alpha = 100;
mask._x = 0;
mask._y = 0;
var mc:MovieClip = container.createEmptyMovieClip("mc", container.getNextHighestDepth());
var mclListener:Object = new Object();
mclListener.onLoadInit = function(mc:MovieClip) {
	mc._x = mask._width/2-mc._width/2+mask._x;
	mc._y = mask._height/2-mc._height/2+mask._y;
	mc.setMask(mask);
	scrollMC();
};
var image_mcl:MovieClipLoader = new MovieClipLoader();
image_mcl.addListener(mclListener);
image_mcl.loadClip(myPicture, mc);
//
function scrollMC() {
	runner.onEnterFrame = function() {
		if (mask.hitTest(this._xmouse+cXPos, this._ymouse+cYPos, false)) {
			var px = (mask._xmouse*mask._xscale/100)*100/mask._width;
			var py = (mask._ymouse*mask._yscale/100)*100/mask._height;
			var maxX = mc._width-mask._width;
			var maxY = mc._height-mask._height;
			var dx = -px*maxX/100;
			var dy = -py*maxY/100;
			mc._x += (dx-mc._x)/20;
			mc._y += (dy-mc._y)/20;
		}
		if (mc._x>mask._x) {
			mc._x = mask._x;
		}
		if (mc._x<-(mc._width-mask._width)) {
			mc._x = -(mc._width-mask._width);
		}
		if (mc._y>mask._height) {
			mc._y = mask._height;
		}
		if (mc._y<-(mc._height-mask._height)) {
			mc._y = -(mc._height-mask._height);
		}
	};
}

 

[MH Design]

Ich habs jezt ausprobiert, aber leider fährt das Bild nur nach unten, und bewegt sich dan garnicht mehr.

 

[Denniz]

Hast du denn die Ausschnittgröße richtig angegeben, der muß natürlich kleiner als das eigentliche Bild sein.

 

[MH Design]

Es funktioniert alles perfekt, vielen Dank!