Comunidad de diseño web y desarrollo en internet online

Menú con íconos que se agrandan y acomodan

Citar            
MensajeEscrito el 06 Oct 2008 10:53 pm
Hola a todos... he estado buscando pero no he podido encontrar nada... También es porque no sé qué palabras claves usar... He encontrado una página con un menú muy chévere! quiero ponerlo en mi página, son unos íconos que se agrandan conforme el mouse se acerca, pero a la vez, los íconos que están a su costado se acomodan para no quedar solapados. El menú está en la página: http://altamiraweb.net/diseno-web.htm
Está hecho al parecer en javascript, haciendo crecer una imagen contenida en una tabla, así sí lo sabría hacer, lo que pasa es que quiero hacer mi página enteramente en flash. He estado probando con la función hitTestObject() pero creo que por allí no va la solución.
Espero que alguien me pueda dar una idea de cómo hacer para lograr ese efecto.
Muchas gracias
Justo Debarbieri

Por justo_13

4 de clabLevel



 

msie7
Citar            
MensajeEscrito el 06 Oct 2008 11:06 pm
Creo que lo que buscas es esto

Por The Fricky!

Presidente

6168 de clabLevel

3 tutoriales
8 articulos

Genero:Masculino   Bastard Operators From Hell Héroes

Piccola Venezia...

firefox
Citar            
MensajeEscrito el 10 Oct 2008 02:21 am
Perfecto! muchas gracias... lo acomodé a mi necesidad en ActionScript 3... me quedó como lo pongo... a ver si a alguien le interesa... Los íconos se agrandan por una funcion que el el Lístener EnterFrame de cada ícono.

menu1.addEventListener(Event.ENTER_FRAME,agrandar);
menu2.addEventListener(Event.ENTER_FRAME,agrandar);
menu3.addEventListener(Event.ENTER_FRAME,agrandar);
menu4.addEventListener(Event.ENTER_FRAME,agrandar);

function agrandar(o:Object):void {
var diferencia:Number = Math.sqrt(Math.pow(this.mouseX - o.currentTarget.x,2) + Math.pow(this.mouseY - o.currentTarget.y,2));
if (diferencia < 300) {
o.currentTarget.scaleY = o.currentTarget.scaleX = 2 - diferencia/300;
}
else {
o.currentTarget.scaleY = o.currentTarget.scaleX = 1;
}
}

var menucount:Number = 4;
var espaciado:Number = 50;

//siempre llama a la funcion posicionar
this.addEventListener(Event.ENTER_FRAME, posicionar);

function posicionar(o:Object):void {
var anchoMenu = 0;

for (var i = 1; i <= menucount; i++) {
anchoMenu += this.getChildByName("menu" + i).width;
}
//logramos el ancho total del menu
anchoMenu += (menucount - 1) * espaciado;

//es la posicion de cada icono en el menu
var posXIcono = Math.round(- anchoMenu / 2);

posXIcono += Math.round(this.getChildByName("menu1").width / 2);
//como el elemento uno no ha sido establecido se le resta su ancho menos al elemento 2 para lograr su posición
this.menu1.x = posXIcono;

for (i = 2; i <= menucount; i++) {
posXIcono += (this.getChildByName("menu" + (i-1)).width / 2) + espaciado + (this.getChildByName("menu" + i).width / 2);
//ubicamos los siguientes menus y ya esta...
this.getChildByName("menu" + i).x = posXIcono;
}
}

Por justo_13

4 de clabLevel



 

msie7

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.