Comunidad de diseño web y desarrollo en internet online

multi tab drop menu

Citar            
MensajeEscrito el 06 Nov 2008 07:13 pm
bueno, he visto un menu que creo que le gustara a mucha gente por eso lo pongo aqui tambien... pero lo que pasa es que está en actionscript3 :'( y a mi no me viene bien, pero bueno... para quien lo quiera...

mi pregunta es si se podria hacer algo parecido en AC 2 o si ya hay algun post abierto parecido a este, porque me parece muy basico...

aqui viene un ejemplo y tambien el archivo
http://ffiles.com/flash/menus/multi_tab_drop_menu_1850.html

pero mi pregunta es... (mas que nada por curiosidad, porque ya esto me mata! xD)

si quieres que estos 'botones' o lo que sean porque en el archivo no aparecen, parece que va todo con codigo... te dirijan por ejemplo al fotograma dos... como lo harias? porque vaya, con eso de que esta en AC3 pues me hace menos caso todavia

pongo el codigo:

[quote="// Tab-Drop Multi Menu
// author: [email protected]
// http://dangerbeuys.de
// Do whatever you want to do!


// important! For working links, remove Comment in Line 112!

// import TweenLite (http://blog.greensock.com/tweenliteas3/)
import gs.TweenLite;
import fl.motion.easing.*;


var tabContainer:Sprite = new Sprite();
var tabArray:Array = new Array();

// Enter your Menu-Button Text here. Button Order is left to right.
var txtArray:Array = ["home", "news", "download", "contact", "info", "links"];

// Enter your URLs here. Important: must be in the same order than text above!
var urlArray:Array = ["link01", "link02", "link03", "link04", "link05", "link06"];

// Description Text goes in here!
var descArray:Array = ["Welcome to the jungle!", "What's new?", "some free stuff for you", "Hello, anybody there?", "What you need to know!", "You know what it means."];

// Number of buttons (must correspond to Number of Text & URLs)
var tabcount:int = 6;
// How much space between buttons
var tabspacing:int = 10;

// Tabs-Background
var baseColor:uint = 0x000000;
// Color for Mouse-Over
var overColor:uint = 0x00CCFF;
// Color for active button
var activeColor:uint = 0xFF3300;

// Positioning of description text
var desctxt:Desctxt = new Desctxt();
desctxt.x = stage.stageWidth - (desctxt.width + tabspacing);
desctxt.y = 75;
desctxt.alpha = 0;
addChild (desctxt);

// make some tabs
function initTab ():void
{
for (var i = 0; i < tabcount; i++)
{
var tab:Tab = new Tab();
TweenLite.to (tab.body, 0, {tint: baseColor});
tabArray.push (tab);
tabArray[i].linkId = i;

// Tabs x - Position
tab.x = tabspacing * .5 + (stage.stageWidth - tabcount * (tab.width + tabspacing)) * .5 + Math.floor( i / 1 ) * (tab.width + tabspacing);
// Tabs initial y - Position
tab.y = 30;
tab.txt.text = txtArray[i];

tab.addEventListener (MouseEvent.MOUSE_OUT, tabOut);
tab.addEventListener (MouseEvent.MOUSE_OVER, tabOver);

tab.buttonMode = true;
tab.mouseChildren = false;
tabContainer.addChild (tab);
}
addChild (tabContainer);
}
function tabOver (event:MouseEvent):void
{
var target:Object = event.currentTarget;
target.addEventListener (MouseEvent.MOUSE_UP, tabUp);
if (target.activa != 1)
{
TweenLite.to (target.body, .2, {tint: overColor});
TweenLite.to (target, .8, {y: 70, ease: Elastic.easeOut});
}
desctxt.desc.text = descArray[target.linkId];
TweenLite.to (desctxt, .8, {alpha:1});
}
function tabOut (event:MouseEvent):void
{
var target:Object = event.currentTarget;
target.removeEventListener (MouseEvent.MOUSE_UP, tabUp);
TweenLite.to (target.body, 1.5, {tint: baseColor});
TweenLite.to (target, 1, {y: 30, ease: Back.easeInOut});
TweenLite.to (desctxt, 1, {alpha:0});
}
function tabUp (event:MouseEvent):void
{
var target:Object = event.currentTarget;

for (var i in tabArray)
{
if (tabArray[i] != target)
{
tabArray[i].activa = 0;
tabArray[i].addEventListener (MouseEvent.MOUSE_OVER, tabOver);
tabArray[i].addEventListener (MouseEvent.MOUSE_OUT, tabOut);
TweenLite.to (tabArray[i].body, 1.5, {tint: baseColor});
TweenLite.to (tabArray[i], 1, {y: 30, ease: Back.easeInOut});
}
else
{
tabArray[i].activa = 1;
tabArray[i].removeEventListener (MouseEvent.MOUSE_OUT, tabOut);
TweenLite.to (tabArray[i].body, .3, {tint: activeColor});
//trace (urlArray[tabArray[i].linkId]);// good for checking URLs in Flash

// Uncomment the following line to activate linking to URL!
//navigateToURL (new URLRequest(urlArray[tabArray[i].linkId]),"_self");
}

}

}

// Go, Baby!
initTab (); "]

aqui viene lo de las direcciones:
// Enter your Menu-Button Text here. Button Order is left to right.
var txtArray:Array = ["home", "news", "download", "contact", "info", "links"];

// Enter your URLs here. Important: must be in the same order than text above!
var urlArray:Array = ["link01", "link02", "link03", "link04", "link05", "link06"];


// Description Text goes in here!
var descArray:Array = ["Welcome to the jungle!", "What's new?", "some free stuff for you", "Hello, anybody there?", "What you need to know!", "You know what it means."];

y como se haria? porque no funciona con lo de decir escena 1 , o poner el numero del fotograma... (xD que ! se nota que de AS 3 controlo menos incluso que del 2 :S)


bueno a ver si entre todos podemos sacar algo de esto...

muchas gracias!!

Por kiona

7 de clabLevel



 

msie7
Citar            
MensajeEscrito el 07 Nov 2008 02:37 am
te conviene poner el codigo en unas etiquetas as
porque mira el codigo xD
no te dan ganas ni de mirarlo de reojo :p
busca fade in fade out rosvel
aca ene l buscdor
esa es la respuesta ^^
beso

Por ironeric23

Claber

407 de clabLevel



Genero:Femenino  

mozilla
Citar            
MensajeEscrito el 07 Nov 2008 11:09 am
es que no se como se pone eso que haceis vosotros de colgar el codigo en una ventanita! :'(

pd: voy a ver eso que dices! ;J ... ¬¬ pero como luego no sea!! >:/ ....... xD

saludos!

Por kiona

7 de clabLevel



 

msie7
Citar            
MensajeEscrito el 07 Nov 2008 11:28 am

ironeric23 escribió:

te conviene poner el codigo en unas etiquetas as
porque mira el codigo xD
no te dan ganas ni de mirarlo de reojo :p
busca fade in fade out rosvel
aca ene l buscdor
esa es la respuesta ^^
beso

pero a ver! fade in fade out es algo asi cono que se ilumine y se apague!... y esoq ue tiene que ver con lo que he preguntado!? :roll:

si se trata de unos botones que suben y bajan, vale que tienen un poco de fade.... pero joe eso es lo de menos! como si no cambian de color!! :?

y claro que lo podria hacer a mano... pero joe! si existe un codigo pues mejor! porque asi les pudeo cambiar el tamaño y demas todo lo que me de la gana... y no uno a uno...

pero si en el ejemplo se ve claramente lo que quiero!! :'(

aqui el codigo! a ver si se ve bien por dios!! porque con eso de que no te deja editar los mensajes!! :S



Código :

// Tab-Drop Multi Menu
// author: [email protected] 
// http://dangerbeuys.de
// Do whatever you want to do!


// important! For working links, remove Comment in Line 112!

// import TweenLite (http://blog.greensock.com/tweenliteas3/)
import gs.TweenLite;
import fl.motion.easing.*;


var tabContainer:Sprite = new Sprite();
var tabArray:Array = new Array();

// Enter your Menu-Button Text here. Button Order is left to right. 
var txtArray:Array = ["home", "news", "download", "contact", "info", "links"];

// Enter your URLs here. Important: must be in the same order than text above!
var urlArray:Array = ["link01", "link02", "link03", "link04", "link05", "link06"];

// Description Text goes in here!
var descArray:Array = ["Welcome to the jungle!", "What's new?", "some free stuff for you", "Hello, anybody there?", "What you need to know!", "You know what it means."];

// Number of buttons (must correspond to Number of Text & URLs)
var tabcount:int = 6;
// How much space between buttons
var tabspacing:int = 10;

// Tabs-Background
var baseColor:uint = 0x000000;
// Color for Mouse-Over
var overColor:uint = 0x00CCFF;
// Color for active button
var activeColor:uint = 0xFF3300;

// Positioning of description text
var desctxt:Desctxt = new Desctxt();
desctxt.x = stage.stageWidth - (desctxt.width + tabspacing);
desctxt.y = 75;
desctxt.alpha = 0;
addChild (desctxt);

// make some tabs
function initTab ():void
{
for (var i = 0; i < tabcount; i++)
{
var tab:Tab = new Tab();
TweenLite.to (tab.body, 0, {tint: baseColor});
tabArray.push (tab);
tabArray[i].linkId = i;

// Tabs x - Position
tab.x = tabspacing * .5 + (stage.stageWidth - tabcount * (tab.width + tabspacing)) * .5 + Math.floor( i / 1 ) * (tab.width + tabspacing);
// Tabs initial y - Position
tab.y = 30;
tab.txt.text = txtArray[i];

tab.addEventListener (MouseEvent.MOUSE_OUT, tabOut);
tab.addEventListener (MouseEvent.MOUSE_OVER, tabOver);

tab.buttonMode = true;
tab.mouseChildren = false;
tabContainer.addChild (tab);
}
addChild (tabContainer);
}
function tabOver (event:MouseEvent):void
{
var target:Object = event.currentTarget;
target.addEventListener (MouseEvent.MOUSE_UP, tabUp);
if (target.activa != 1)
{
TweenLite.to (target.body, .2, {tint: overColor});
TweenLite.to (target, .8, {y: 70, ease: Elastic.easeOut});
}
desctxt.desc.text = descArray[target.linkId];
TweenLite.to (desctxt, .8, {alpha:1});
}
function tabOut (event:MouseEvent):void
{
var target:Object = event.currentTarget;
target.removeEventListener (MouseEvent.MOUSE_UP, tabUp);
TweenLite.to (target.body, 1.5, {tint: baseColor});
TweenLite.to (target, 1, {y: 30, ease: Back.easeInOut});
TweenLite.to (desctxt, 1, {alpha:0});
}
function tabUp (event:MouseEvent):void
{
var target:Object = event.currentTarget;

for (var i in tabArray)
{
if (tabArray[i] != target)
{
tabArray[i].activa = 0;
tabArray[i].addEventListener (MouseEvent.MOUSE_OVER, tabOver);
tabArray[i].addEventListener (MouseEvent.MOUSE_OUT, tabOut);
TweenLite.to (tabArray[i].body, 1.5, {tint: baseColor});
TweenLite.to (tabArray[i], 1, {y: 30, ease: Back.easeInOut});
}
else
{
tabArray[i].activa = 1;
tabArray[i].removeEventListener (MouseEvent.MOUSE_OUT, tabOut);
TweenLite.to (tabArray[i].body, .3, {tint: activeColor});
//trace (urlArray[tabArray[i].linkId]);// good for checking URLs in Flash

// Uncomment the following line to activate linking to URL!
//navigateToURL (new URLRequest(urlArray[tabArray[i].linkId]),"_self");
}

}

}

// Go, Baby!
initTab (); 



no salen los colorines... pero bueno...
si soys tan amables de decirmelo en el proximo mensaje... pues bienvenido sea

gracias!! :)

Por kiona

7 de clabLevel



 

msie7
Citar            
MensajeEscrito el 07 Nov 2008 12:40 pm
errr
dijiste que con tu codigo daba problemas al sacar rapido el mouse
con el fade in fade out no :?
solo cambia la animacion pero el boton hacelo de esa forma

Por ironeric23

Claber

407 de clabLevel



Genero:Femenino  

mozilla
Citar            
MensajeEscrito el 07 Nov 2008 03:50 pm
lo que dije es que funciona pero que no te llevan a ninguna parte esos botones... solamente a web y demas... pero si lo que quiero es que vayan a un fotograma... como se haria?

y si se puede hacer algo parecido con Action script 2

aqui es donde se supone que irian los links, al principio del codigo:

Código :

 // Enter your URLs here. Important: must be in the same order than text above!
var urlArray:Array = ["link01", "link02", "link03", "link04", "link05", "link06"];


pero si lo que quiero es que vayan a un fotograma, como se haria? porque con lo de poner el numero del fotograma o la escena y demas... pues no va

muchas gracias!!

Por kiona

7 de clabLevel



 

msie7

 

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