Efecto scroll con Imagen

[ORendon]

Saludos
Mi problema es el siguiente, tengo una pelicula de 400x400 (ancho,alto) y una imagen de 700x400(ancho,alto).
La cuestion es que como la imagen no alcanza a verse totalmente, necesito lograr un efecto que al pasar el mouse por el extremo derecho de la imagen, esta se desplace hacia la izquierda, y obviamente al pasar el mouse por el extremo izquierdo de la imagen, esta se desplae a la derecha.
Habia pensado poner un Boton en cada extremo y en el rollOver cambiar la propiedad ._x de la imagen, pero no he tenido mucho exito.
Ademas hay que validar varias cosas y no se como.
Tendria q validar q cuando la imagen se este desplazando a la izkierda, el extremo derecho de la misma no sobrepasara al extremo derecho de la pelicula, igualmente cuando la imagen se desplace a la derecha que el limite sea el borde izkierdo de la pelicula.
No se si me hago entender.

Agradeceria enormemente cualquier tipo de ayuda

[Mahalo]

Hola.
Lo que tienes que hacer es colocar el clip de película con la imagen en la escena, seleccionarlo y aplicar el código onClipEvent. En dicho código recoges los datos del _xmouse mediante un condicional (if). Si es menor de 50 (por ejemplo), que la imagen se vaya desplazando. Sería algo así:

Código:

onClipEvent (entreFrame){
   if (_root._xmouse<50){
      this._x+=1;
      if (this._x>350){
         this._x=350;
      }
   }
   if (_root._xmouse>350){
      this._x-=1;
      if (this._x<50){
         this._x=50;
      }
   }
}

No lo he probado, y puede que me haya equivocado en algún dato o variable. Espero que te sirva, un saludo.

[ORendon]

Hola Mahalo, muchas gracias por atender

El codigo que posteaste funciona perfectamente, solo fue cuestion de cambiarle los rangos para adaptarlos a la pelicula, y de coregir el error de sintaxis '(entreFrame)' por '(enterFrame)'. jeje, Muchas Gracias x ese AScript.

Ahora surge otro problema con respecto al mouse, resulta de que la imagen debe moverse cuando el puntero del mouse esta en uno de los dos extremos de la pelicula, pero esta sucediendo que si pasamos el mouse por alguno de los dos extremos, y luego retiramos el mouse de la pelicula, la imagen se sigue moviendo como si el mouse todavia estuviera allí, pareciese como si la ultima posicion del mouse fuera almacenada y se siguiera ejecutando el codigo con esa ultima posicion.

Ahora la pregunta es, como se hace para Validar si el mouse AUN se encuentra situado dentro de la pelicula ?, para que cuando no lo esté, no se desplaze la imagen.

El AS se encuentra de esta forma:

Código:

//Tamaño pelicula 400x400
//Tamaño imagen 700x400
onClipEvent (enterFrame){
   if (_root._xmouse<50){
      this._x+=5;
      if (this._x>10){
         this._x=10;
      }
   }
   if (_root._xmouse>350){
      this._x-=5;
      if (this._x<-300){
         this._x=-300;
      }
   }
}

Que linea, o instruccion se tendria que agregar para corregir el error actual ?

De ante mano muchas gracias, Bienvenida sea cualquier ayuda, o aclaracion.

Caho

[Mahalo]

Hola de nuevo.
Primero perdón por el error del entreFrame, je, je, ni me di cuenta.
Y para el problema pues tienes varias opciones. Puedes convertir la imagen en un botón y que se ejecute la acción con un rollOver. También puedes añadir más datos al condicionante, por ejemplo para ir a la izquierda que compruebe si el _xmouse es menor que 50 y que además sea mayor que 0; es decir, crearías un intervalos de acción:

Código:

if (_root._xmouse<50 && _root._xmouse>0){
...
}

Por supuesto también tendrías que añadir el condicionante para cuando el ratón se sale de la pantalla por arriba o abajo, puesto que mi código sólo actúa en horizontal.
Un saludo.

[ORendon]

Hola Mahalo, ya tengo hasta pena con tigo, estoy dele y dele y dele con lo mismo.
Pero sucede que el 85% de las veces la imagen se comporta de manera adecuada, el otro 15% saco el mouse de la pelicula y la imagen sigue movinedose.
No se que podar ser, le he dado nuevos intervalos pero no funciona al 100%.
El AS esta de esta forma:

Código:

//Tamaño pelicula 400x400
//Tamaño imagen 700x400
onClipEvent (enterFrame){
	if ((_root._ymouse>10)&&(_root._ymouse<390)){
		if ((_root._xmouse<50) && (_root._xmouse>5)){
			this._x+=5;
			if (this._x>10){
				this._x=10;
      		             }
		}
		if ((_root._xmouse>350)&&(_root._xmouse<395)){
			this._x-=5;
		    if (this._x<-300){
				this._x=-300;
		    }
		}
	}
}

A mi parecer los intervalos estan bien, no se porque aveces no se cumple el condicional...

Gracias x la atencion

Caho

[Mahalo]

Hola.
Te propongo otra cosa puesto que hay un lío de variables:
En la escena principal, en una capa inferior a la de la imagen, y sin que se vean, colocas dos clips de película de dos cuadrados del tamaño que quieras que el cursor haga su efecto. Esos cuadrados harán la función de botón, pero sin que salga el dedito de la flecha.
Entonces haces un hitTest del cursor con los cuadrados.
Algo así:

Código:

onClipEvent (enterFrame){
   if (this.hitTest(_root._xmouse,_root._ymouse)){
      _root.imagen._x+=1;
   }
}

Eso sería para el cuadro de la izquierda. Para el de la derecha tan sólo cambia el el "+" por "-", claro. Ten en cuenta que la instancia de la imagen se llama "imagen".
Un saludo.

[ORendon]

Muchisisisisisimas gracias, Mahalo.
El AS funciona perfectamente y en unas pequeñas lineas de codigo.
Solo una cosilla...
No entiendo que hace la instruccion hitTest...

Código:

onClipEvent (enterFrame){ //Esta linea si la entiendo
   if (this.hitTest(_root._xmouse,_root._ymouse)){//esta linea NO lo entiendo
      _root.imagen._x+=1; // esta linea tambien la entiendo
   }
}

Te agradeceria me explicaras para que sirve "hitTest(x,y)", que pena pero es que me gusta saber que es lo que hace exactamente el codigo que voy a usar en la pelicula.
No entiendo que es lo que realmente se esta preguntando en el IF(..), ya que no entiendo para que sirve hitTest.

Saludos

Caho

[Mahalo]

Hola. La línea que dices no entender comprueba si hay contacto entre la instancia donde está el código y las coordenadas del ratón.
Puedes comprobar contactos entre instancias de película cambiando lo que hay en el paréntesis por el nombre de instancia con su ruta correspondiente (_root.mc).
Un saludo.

[ORendon]

Una vez mas te doy las gracias Mahalo
Con lo que me explicaste y con lo que lei en las ayudas de flash, me ha quedado todo muy muy claro.

Muchas garcias x todo

Caho

[Mauri1]

Hola Mahalo. Muy bueno tu Script.
Mira, yo lo ocupe y le hice algunos cambios, pero no consigo que a medida que el cursor se desplaze hacia la derecha, la velocidad de desplazamineto de la imagen aumente progresivamnete. Lo hice colocando varios movieclip, uno al lado del otro, y cada uno hacia la derecha le iba aumentando el valor de _x-=1 y resulta !!!. Pero quiero hacerlo con Acciones.
¿ sabes hacerlo ?
Y que además, cuando se haya alcanzado el borde de la imagen, se detenga el desplazamiento hacia ese lado y esté activado sólo para el otro extremo.
Muchas gracias.

Aquí está el Código

_root.onEnterFrame = function() {
x = Math.round(_xmouse);
if (this.hitTest(_root._xmouse, _root._ymouse)) {
if (_xmouse<194) {
_root.imagen._x += 2;
} else {
_root.imagen._x -= 2;
}
}
};

Aquí está el resultado
http://codecool.webcindario.com/DesplazarImagen.html

[Mahalo]

Hola.
Primero, para que la imagen se detenga tienes que quedarte con los valores _x que supongan los límites. Por ejemplo x1 a la izquierda y x2 a la derecha.

Código:

onClipEvent (enterFrame){
   if (this._x<x1){
      this._x=x1;
   }
   if (this._x>x2){
      this._x=x2;
   }
}

Para el movimiento más o menos rápido del scroll, basta una simple relación matemática. Por poner un ejemplo, tenemos en cuenta que tu tamaño es de 388 de ancho, queremos que lo más rápido sea 10. Entonces quedaría algo así:

Código:

onClipEvent (enterFrame){
   if (this.hitTest(_root._xmouse,_root._ymouse){
      i=((_root._xmouse)-194)/20;
      _root.imagen-=i;
   }
}

i es el incremento en el movimiento. Haz las cuentas: si _xmouse igual a 100, i=-5 (aprox); si _xmouse=300, i=5 (aprox). Si es igual a 194 (la mitad), i=o (imagen parada).
No lo he probado, tan sólo a papel y lápiz, pero creo que va bien.
Un saludo.

[Mauri1]

Muchas gracias Mahalo, lo probaré y te cuento.