fondo movimiento según ratón

Encontré una pregunta similar en el foro pero estaba sin responder desde el 2007

Estoy preparando un menú de PC me gustaría poner un fondo del estilo que al desplazar el ratón sobre el menú, el fondo se moviese.
En el post que encontré en el foro sin respuesta tenian este ejemplo http://www.chromazone-imaging.co.uk/flashindex.html
Yo busco algo más simple como por ejemplo esto http://www.promosamsung.com/VODAFONESD/

Intenté con un ejemplo que me pasaron de un usuario "Fento" pero el intento salió fallido
Espero que alguien pueda ayudarme un poco u orientarme (hacer tonterias en flash aun bien, pero en action scrip 0 >.<)

Hola,
este efecto de scroll se llama "paralaje" (parallax en inglés), y la verdad es que no tiene demasiada complicación. Lo único que tienes que hacer es mover los elementos en función de la posición del ratón, pero desplazando los que están más alejados en menor proporción que los que están más cerca. Aquí te dejo un pequeño ejemplo de cómo funciona:

Código ActionScript :

var centerX:Number = Stage.width / 2;
var centerY:Number = Stage.height / 2;

var mouseX:Number;
var mouseY:Number;

var mc1:MovieClip = CreateSquare();
var mc2:MovieClip = CreateSquare();
var mc3:MovieClip = CreateSquare();

mc2._xscale = 150;
mc2._yscale = 150;
mc3._xscale = 200;
mc3._yscale = 200;

mc1._x = mc2._x = mc3._x = Stage.width / 2;
mc1._y = mc2._y = mc3._y = Stage.height / 2;

this.onMouseMove = function():Void
{
   mouseX = this._xmouse - centerX;
   mouseY = this._ymouse - centerY;
   mc1._x = centerX + mouseX / 20;
   mc1._y = centerY + mouseY / 20;
   mc2._x = centerX + mouseX / 10;
   mc2._y = centerY + mouseY / 10;
   mc3._x = centerX + mouseX / 5;
   mc3._y = centerY + mouseY / 5;
}

function CreateSquare():MovieClip
{
   var depth:Number = this.getNextHighestDepth();
   var mc:MovieClip = this.createEmptyMovieClip("mc" + depth, depth);
   mc.lineStyle(1, 0x000000);
   mc.beginFill(0xFF0000, 50);
   mc.moveTo(-50, -50);
   mc.lineTo(50, -50);
   mc.lineTo(50, 50);
   mc.lineTo(-50, 50);
   mc.lineTo(-50, -50);
   mc.endFill();
   return mc;
}

Y si quieres que el movimiento sea más suave, puedes usar Tweens:

Código ActionScript :

import mx.transitions.Tween;
import mx.transitions.easing.*;

var centerX:Number = Stage.width / 2;
var centerY:Number = Stage.height / 2;

var mouseX:Number;
var mouseY:Number;

var mc1:MovieClip = CreateSquare();
var mc2:MovieClip = CreateSquare();
var mc3:MovieClip = CreateSquare();

mc2._xscale = 150;
mc2._yscale = 150;
mc3._xscale = 200;
mc3._yscale = 200;

mc1._x = mc2._x = mc3._x = Stage.width / 2;
mc1._y = mc2._y = mc3._y = Stage.height / 2;

this.onMouseMove = function():Void
{
   mouseX = this._xmouse - centerX;
   mouseY = this._ymouse - centerY;
   MoveTween(mc1, centerX + mouseX / 20, centerY + mouseY / 20);
   MoveTween(mc2, centerX + mouseX / 10, centerY + mouseY / 10);
   MoveTween(mc3, centerX + mouseX / 5, centerY + mouseY / 5);
}

function MoveTween(mc:MovieClip, x:Number, y:Number):Void
{
   var tweenX:Tween = new Tween(mc, "_x", Strong.easeOut, mc._x, x, 24, false);
   var tweenY:Tween = new Tween(mc, "_y", Strong.easeOut, mc._y, y, 24, false);
}

function CreateSquare():MovieClip
{
   var depth:Number = this.getNextHighestDepth();
   var mc:MovieClip = this.createEmptyMovieClip("mc" + depth, depth);
   mc.lineStyle(1, 0x000000);
   mc.beginFill(0xFF0000, 50);
   mc.moveTo(-50, -50);
   mc.lineTo(50, -50);
   mc.lineTo(50, 50);
   mc.lineTo(-50, 50);
   mc.lineTo(-50, -50);
   mc.endFill();
   return mc;
}

Muchisimas gracias
Parece bastante simple, pero adaptarlo para poner imagenes en lugar de los cuadros para mi se me hace muy dificil >.<

Con el primer ejemplo ya tube más que suficiente para hacer pruebas aunque el segudo esta también muy bien .
No tengo ni idea de action script, pero en vez de igualar a CreateSquare() puse a un nombre q tenga asignada una imagen y me sirvió más que de sobra

Unicamente que las imagenes me las ponia con el efecto pero aparecian centradas en a imagen superior izquierda, aunque pude solventarlo mas o menos.
Ademas que al poner varias imagenes se agrandan las del fondo y para usar imagenes sería más práctico que se hiciesen más pequeñas las imagenes de delante o incluso mejor que no variasen de tamaño , pero ya intentaré solventarlo y probando algunas cosas

En definitiva, poco a poco me fui buscando la vida
Muchisimas gracias :3

Si te aparecian en el extremos superior izq. puede que sea por el punto de orientacion de tu MC.
Fijate si cuando creaste el MC, dejaste esto asi:



Creo, cambiandole eso dejandolo en el centro, como se ve en esta imagen.



No se si sea eso...

Muchas gracias Andromeda (lo habia solucionado de otra pero igualmente gracias)

Sigo haciendo pruebas con el menú :3 y espero terminarlo pronto con las indicaciones que me habeis facilitado

Estoy intentado aplicar este efecto a un fondo que he creado yo, con dos imagenes diferentes pero no consigo moviemiento alguno.
Cada una de las fotos hay qeu meterla en un mc? porque por lo que leo en el codigo lo crea solo, o me estoy equivocando?
necesito un cable

Claro. El código que puse de ejemplo crea los clips (lo hice así para que se pudiese probar sin tener que incluir nada en la biblioteca). Para poner tus imágenes tienes que meter cada una en un movieclip, seleccionar la opción de exportar para ActionScript y ponerle un identificador. En este ejemplo se usan dos clips cuyos identificadores son mc1 y mc2:

Código ActionScript :

import mx.transitions.Tween;
import mx.transitions.easing.*;

var centerX:Number = Stage.width / 2;
var centerY:Number = Stage.height / 2;

var mouseX:Number;
var mouseY:Number;

var tweenX:Tween;
var tweenY:Tween;

var mc1:MovieClip = this.attachMovie("mc1", "mc1", this.getNextHighestDepth());
var mc2:MovieClip = this.attachMovie("mc2", "mc2", this.getNextHighestDepth());

//mc2._xscale = mc2._yscale = 150; //Usarlo sólo si quieres escalar la segunda imagen

mc1._x = mc2._x = Stage.width / 2;
mc1._y = mc2._y = Stage.height / 2;

this.onMouseMove = function():Void
{
   mouseX = this._xmouse - centerX;
   mouseY = this._ymouse - centerY;
   MoveTween(mc1, centerX + mouseX / 20, centerY + mouseY / 20);
   MoveTween(mc2, centerX + mouseX / 10, centerY + mouseY / 10);
}

function MoveTween(mc:MovieClip, x:Number, y:Number):Void
{
   tweenX = new Tween(mc, "_x", Strong.easeOut, mc._x, x, 24, false);
   tweenY = new Tween(mc, "_y", Strong.easeOut, mc._y, y, 24, false);
}

muchas gracias isidoro, he conseguido hacerlo añadiendo mis fondos, pero tengo una duda, como podria hacer para una de las fotos no este centrada si no que se situe en la parte izquierda de la pantalla?
Muchas gracias de antemano

Pues para ese clip habría que omitir centerX y centerY en la función MoveTween, pero la forma más fácil de hacer eso es cambiar el código para que ninguno de los clips esté centrado de la siguiente forma:

Código ActionScript :

import mx.transitions.Tween;
import mx.transitions.easing.*;

var tweenX:Tween;
var tweenY:Tween;

var mc1:MovieClip = this.attachMovie("mc1", "mc1", this.getNextHighestDepth());
var mc2:MovieClip = this.attachMovie("mc2", "mc2", this.getNextHighestDepth());

this.onMouseMove = function():Void
{
   MoveTween(mc1, this._xmouse / 20, this._ymouse / 20);
   MoveTween(mc2, this._xmouse / 10, this._ymouse / 10);
}

function MoveTween(mc:MovieClip, x:Number, y:Number):Void
{
   tweenX = new Tween(mc, "_x", Strong.easeOut, mc._x, x, 24, false);
   tweenY = new Tween(mc, "_y", Strong.easeOut, mc._y, y, 24, false);
}

y lo que tendrías que hacer es mover a mano la imagen de los clip que quieres que estén centrado (es decir, abrir por ejemplo mc1 y despazar el gráfico para que quede centrado con respecto al tamaño del stage).

Muy bueno isidoro, ya lo he conseguido, y que da un resultado increible, lo estoy aplicando al fondo de una pagina web que estoy creando, pero ahora no se porque me sale el archivo flash centrado, dejando un borde a su alrededor de unos 20 px, he probado incluso con CSS pero sigue manteniendose posicionado en el centro. alguna idea?

Hola, oigan a mi no me sucede nada de nada

mi pregunta es, pongo el codigo dentro de las imagenes? o solo le doy clic afuera de todas las imagenes y hay pongo el codigo?, las imagenes las convierto en MC o solo las arrastro desde donde tengo las imagenes al flash y las dejo asi?, si las convierto en MC que nombre de instancia le doy?, sorry por favor necesito ayuda

Hola,
pega el código en la línea de tiempo principal. Los clips tienen que estar en la bilbioteca, y en los attachMovie pon los nombres que correspondan a tus clips.