Efecto de cursor atado a un hilo (2)

Siguiendo con este efecto, ahora hay que hacer que la linea se enganche al cursor.
Para eso hay que hacer que el clip que dibuja el final de la linea se coloque en la posición del mouse, para eso crearemos una funcion:

function sigueMouse() { marcaFin._x = _xmouse+10; marcaFin._y = _ymouse+20; }

Los 10 y 20 pixeles de margen son para que el clip se coloque en el final de la flecha del cursor y no en la punta.

El codigo que creamos para dibujar la linea tambien lo colocaremos dentro de una funcion:

function dibujaLinea() { this.createEmptyMovieClip("linea", 1); linea.lineStyle(2, 0x000000, 100); linea.moveTo(marcaIni._x, marcaIni._y); linea.curveTo(marcaControl._x, marcaControl._y, marcaFin._x, marcaFin._y); }

Y ahora crearemos un onEnterFrame para que la posicion del clip y la linea se actualice constantemente:

onEnterFrame = function () { sigueMouse(); dibujaLinea(); };

El resultado es este:

 

 

 

 

 

 

 

Ahora quedará actualizar la posición del clip que marca la curva para el efecto más real y dearle un poco de elasticidad a la linea. Eso será en otro post….

 

Compártelo:

Visto 6.506 veces