Accordion Style Flash Menu
The code is very old but guess what … it’s working and it looks beautiful.
With some basic Flash knowledge, you can easily change the size of the movie, change images, add additional buttons, movie clips, animations, …
Update, March 14th, 2008: NOTE: You may NOT Redistribute Source files from your own site. You must link to the page where the source file is located.
Download Flash source .fla file - Flash 8 and Flash MX 2004 .fla files included (Thanks to popljubo for MX Version)
I will appreciate if you can spread the word via social media websites, Thank you.
Related Free Resources:
- Flash glow with trails effect
- Photoshop Stickers: 16 web 2.0 style stickers
- 20 Free Flash Gallery Solutions for Your Images
- Happy Holidays from Visual-Blast!
- Flashmo - Free Flash Templates, Intro, Effects … and more
- Flowplayer - Free video player for web
- Mootools animated sidebar menu
- Social Media Mini Icon Set
- Flash - XML News Slider with AS3
- Free Credit Card Pixel Icons
Loading...
Thanks, thats just what I need
[...] Accordion Style Flash Menu, es un bonito menú acordeón muy similar a ImageMenu realizado en mootools solo que esta vez basado completamente en flash. En este menú, si posees un poco de conocimientos en flash, será fácil agregar contenido mixto, videos clips, animaciones, cambiar las imágenes, añadir botones extras, y demás. [...]
I was looking for such effect for a long time! It really helps!
good jobs!
Great menu y useful for apply!
[...] Demo del menu [...]
Muchas gracias!
[...] de connaissance vous pourrez le modifier facilement la taille et les images. Vous trouverez le .fla ici chez Visual Blast. Tags: Flash, menu, [...]
Unfortunately my Flash MX2004 doesn’t recognize the file format.
What Flash version this Menu is made for?
It’s Flash 8 fla format.
[...] Accordion Style Flash Menu, es un bonito menú acordeón muy similar a ImageMenu realizado en mootools solo que esta vez basado completamente en flash. En este menú, si posees un poco de conocimientos en flash, será fácil agregar contenido mixto, videos clips, animaciones, cambiar las imágenes, añadir botones extras, y demás. [...]
thank you,
now i guess i need to find somebody who can save it for MX 2004: it would be my only chance
by any chance could you please,please convert the source file to be usable in MX 2004( if there not much trouble)?
I’ve found people with Flash version CS3 but this version would do only for Flash 8, which i haven’t got
Sorry, my Flash is also CS3. You need to find someone with Flash 8 to convert it to Flash MX (also when converting change settings for ActionScript version to ActionScript 1.0).
amigo, tentei fazer o download mas deu a seguinte mensagem:
404 Não encontrado
The requested URL /source/flash/accordion_style_free_flash_menu.zip/ does not exist. O URL solicitado / fonte / flash / accordion_style_free_flash_menu.zip / não existe.
você pode enviar o arquivo para meu email, por favor?
@marcelo
I know, translation plugin is doing it, you could click the English flag at Translations - bottom right of the site - to download the file from the original (English) article.
I hope to get access to the comp with flash CS3 so in any case thank you for your promptly answers.
In general this website is an excellent source or web resources: nicely done and with good access to information.
Thanks again
Bonsoir,
J’étais à la recherce de ce type d’effet, cependant le lien indiqué retourne un lien mort.
Bonsoir,
Le lien sur le fichier est un lien mort et renvoie une erreur 404. Serait il possible de le réceptionner par email ?
Merci
[...] Accordion Style Flash Menu es un actrativo menu Accordion hecho en flash donde si pasamos el puntero sobre la categoría se expande para ver todo el contenido. Si posees algo de conocimientos en Flash podes modificar los textos, imágenes y agregar algún contenido descriptivo en el archivo .fla que dispone. Es ideal para sitios estáticos. [...]
good work
MUY BUEN MENU Y APLICABLE A LOS QUE BUSCABA GRASIAS
hola ! me parece genial el documento me está facilitando el trabajo muchísimo (aunque también me está dando más de un quebradero de cabeza.. jaja).
Estoy intentando que una vez abierto el menú cargue un swf externo (según el menú) pero no sé por qué siempre me carga el swf numero 7 (he adaptado la web a 7 secciones).
El código lo he modificado de la siguiente forma:
stop();
speed = 5;
initial_width = 75;
target_width = 800;
sp = rect1._x;
this.createEmptyMovieClip(”emptymc”, 0);
emptymc.onEnterFrame = function() {
for (i=1; i<=7; i++) {
if (_root.hit.hitTest(_root._xmouse, _root._ymouse, true)) {
if (_root["rect"+i].hitTest(_root._xmouse, _root._ymouse, true)) {
new_x = (_root.sp-(75*(i-1)))-rect1._x;
rect1._x += new_x/speed;
n_width = target_width-_root["rect"+i]._width;
_root["rect"+i]._width += n_width/speed;
} else {
n_width2 = initial_width-_root["rect"+i]._width;
_root["rect"+i]._width += n_width2/speed;
}
} else {
new_x = _root.sp-rect1._x;
rect1._x += new_x/(speed+50);
n_width2 = initial_width-_root["rect"+i]._width;
_root["rect"+i]._width += n_width2/(speed-1);
_root.mc.loadMovie(”vinos”+i+”.swf”, 0);
}
_root["rect"+(i+1)]._x = _root["rect"+i]._x+_root["rect"+i]._width;
_root["movie"+i]._x = _root["rect"+i]._x-1;
}
};
¡Gracias de antemano por echarme un cable! tengo la cabeza como un bombo y no sé qué puedo hacer :S
trs.
I would like to modify this code so that I could add a back to main menu button on each page. So basically nothing would happen when you rolloff the top menu bar until you hit the back ot menu button that i would place on each page.
what part of the code i need to adjust to make this happen?
anyone with as3 version of this?
i really would love to see how the code works thanks
eu gostaria de ver a linha de codigo desse menu!
……. simples e muito estiloso
Very useful menu! Thanks for publishing this. Here’s a link to a more basic accordion menu that works well for navigation. Cheers, Brett
[...] menú acordeón realizado en Flash con su FLA para editar y adaptar a nuestras necesidades. Publicado en [...]
Bonjour,
e serais également intéressé pour recevoir ce menu horizontal qui comporte le gros avantage de présenter les titres aussi à l’horizontal.
Merci d’avance Charlie.
[...] Xyberneticos podemos encontrar un atractivo menú en acordeón realizado en Flash con su FLA para editar y adaptar a nuestras [...]
nice work!
hey “lm” do you still need MX 2004 vers. of this work!?
send me a msg at “popljuboatgmaildotcom” I’ll save the file for you
hi, popljubo, I’ve sent you email, thank you!
It would be nice to get this 2004 version file because then I have plenty of time to work on it instead borrowing some time on another comp ( with Flash 8 version). So, thanks again!
You are welcome!
One thing: during the Save As action I receive compatibility msg of lost Advanced/Custom Anti-Aliasing containing data. Also, a capture of that msg is included in my reply.
Muchas Gracias por el Flash!!!!!
its similar to fameid menu
Godd! ery nice thankss
Alguien puede publicar otro enlace de descarga que aparece error porfa
@wzk
To download flash source file you need to go to ORIGINAL (English) article, you can’t download file at translated page
Also from the ORIGINAL article it gives me a 404 error…
It’s probably because of caching files, try now, I CAN download the fla file.
Спасибо большое за исходники, буду тестировать
cool flash (:
como puedo agregar otra seccion del menu??
how can i add another three tabs? the code’s been given me a bit of a trouble and i can’t find a way to sort it out.
Hi
Thanks for this tutorials .I was looking for this kind for long .
I would be dam thankful to u if u could tell me some tutorials to build an accordion with images without using xml.
Thanks once again
Regards
Vij
Est ce possible d’avoir le swf??
J’ai mx 2004 et le swf me permettrait de le convertir et de l’utiliser!
@willo
Download file updated, now it also includes Flash MX 2004 .fla file, thanks to popljubo.
I am trying to fit it in 800 x 600 ( I can change images and initial widht at 133) but the buttons are not working properly.
Hi would someone please explain me the code couse I’m stil learning …
Thanks ..
Regards
I would like to use this menu inside my main swf file, I’ve been trying to change the paths to make it work but i just can’t, the code in my main file is this…
createEmptyMovieClip(”menu_mc”,this.getNextHighestDepth());
menu_mc._x = 0;
menu_mc._y = 460;
loadMovie(”accordion.swf”, menu_mc);
If i apply the loadMovie without creating an emptymovieclip, it works, but then the accordion will be on the top left corner, and what i need is to place it where i want, so if i make an emptymovieclip and place it where i want, then it shows up but the hit area doesn’t work. that’s why i thought i need to change the paths but i’ve tried everything i can think of and it does not work. please, help!
You may need to change your script in main accordion.swf - it has something with _root and this.create zzzz, I think …
gracias por este acordion pero quisiera saber como puedo colocar 4 pestañas mas por que ya logre modificarls otras pero no puedo hacer esa parte y tambien como pude moverlas de lugar por ejemplo antes de la primera quiero colocar otras , ya lo intente y se quedan estaticas , algo aver hecho mal agradecere su ayuda de todo corazón gracias
esta bien shido el menu pero kiero que me digan
como modificarlo y agregar otras pestañas
HI,
the link is not working. Kindly reupload the fla file..
Many thanks
hi raymon,
the link working for me …
“accordion_style_free_flash_menu-v2b.zip”
maybe it’s not bad idea to clear/empty your browser cache [!?]
hola muy bueno el Accordion Style Flash Menu, pero quiero modificarlo para q sea de forma vertical diganme como puedo modificarlo, si alguien tiene el codigo por favor envienmelo a mi correo o ponganlo aqui por favor, se los agradezco mucho
===============================================================
hi very good Accordion Style Flash Menu, but I want to modify q either vertical Can anybody help me change it, if someone has the code please envienmelo my mail or Put here please, be much appreciate
[...] Accordion Style Flash Menu, es un bonito menú acordeón muy similar a ImageMenu realizado en mootools solo que esta vez basado completamente en flash. En este menú, si posees un poco de conocimientos en flash, será fácil agregar contenido mixto, videos clips, animaciones, cambiar las imágenes, añadir botones extras, y demás. [...]
Muchas gracias GRAN RECURSO.
Can you please post the code for Action Script 3.0
I would like to use it in a web application.
But the flash accordion component does not support AS3.0
Can you please help me to convert this AS2.0 code to AS3.0
Thanks in advance
Thank you so much… I was searchin for an horizontal accordion menu which would slide in both direction (right-left) since a long time, and this is almost perfect!
Anyway I’m trying to customize it without great result!
My target is:
- to click on a panel and to keep it open;
- to load on the opened panel an interface (scrolling text, buttons, video);
- to edit the sliding motion so that also the movie1 (first panel from the right) would slide on the left, calculating distance from the center of the movie (now I suppose it calculate the slide starting from the x coordinate of movie1, so that clicking on it, it doesn’t move).
Thanks in advance, thanks anyway… for any hint
Hi. Anyoner have the CS3 ver for this..
answer (might help)
change:
_root["rect"+i]….
to
_root.menu_mc["rect"+i]
it might help for your problem
———————————————————————————
I would like to use this menu inside my main swf file, I’ve been trying to change the paths to make it work but i just can’t, the code in my main file is this…
createEmptyMovieClip(”menu_mc”,this.getNextHighestDepth());
menu_mc._x = 0;
menu_mc._y = 460;
loadMovie(”accordion.swf”, menu_mc);
If i apply the loadMovie without creating an emptymovieclip, it works, but then the accordion will be on the top left corner, and what i need is to place it where i want, so if i make an emptymovieclip and place it where i want, then it shows up but the hit area doesn’t work. that’s why i thought i need to change the paths but i’ve tried everything i can think of and it does not work. please, help!
Thank you very very
Really great work. God bless you!
tks a lot.
hello
what a nice work ! thanks
I am trying to add some more images, to have like 7 menu.
I modified the code :
for (i=1; i<=7; i++) {
i also made a MC “movie7″. but the 7th menu isn’t integrated in the mouvement.
i saw that there is the MC box, which is repeat 6 times, for the 6 menu, but I can’t find them “physically”, I can see them only in the movie explorer.
I think I have to make a new MC called box … but if I can’t find the first one, how can I do that ?
sorry for my english… I hope someone understand my question and can help me.
thank you
so sorry for my first post….
i found the answer… i duplicate the MC box and symply gave him the name rect7.
thank you for this good work.
it’s me again…
so i managed to have a 7th image which moves with the 6 first one. but when i pass on the top of the 7th image with the mouse, nothing happen.
i changed the size of the MC hit, and of the MC Box. is there something to change in the code for that ? i can’t find it.
does someone knows how to do that ?
thank you
Everything seems to be OK, except you might need to go into the ‘MC hit’ and add another layer and shape and resize it that way (by adding another shape area)
As I’m not sure what is wrong with your file, here is flash source file with 7 movies/images in it
http://www.visual-blast.com/so.....movies.rar
Hope it helps
hi Ivan M.
thanks for your answer.
i added another shape in the MC hit… it didn’t work…
but maybe the size of the document was wrong…
i’ll try to add another 8 image, and see if i can do it this time
thank you so much
thank you for this good work. Thnkxx
Hi evryone,
i created a button over the text home, but when i put the mouse over to other menu, like “about”for example, my “home button” placed over to “äbout” text menu.
How can i debug a script to my buttons to follow the movement of menu animations.
If some one publicate the script to solve this question was easyer because i’m started ti use flash recently.
thanks evrybody and sorry for the english.
hola la verdad que esta buenisimo el menu, pude modificarle muchas cosas pero estoy teniendo problemas para tratar de que se abran las pestañas haciendo click ya que si pongo algun contenido y se mueve la flecha se cierra la pestaña y no se puede leer. Mi pedido es si pueden pasarme el código para lograr esto o si tengo que utilizar botones u otras cosas.
Desde ya muchas gracias.
AS3 translation (as adapted for my project):
—————————
stop();
var myRoot:MovieClip = this;
var speed = 7;
var initialwidth = 115;
var targetwidth = 500;
var sp = rect1.x;
var emptymc:MovieClip = new MovieClip();
emptymc.addEventListener(Event.ENTER_FRAME, emptymcFunction);
function emptymcFunction(e:Event):void
{
for (var i=1; i<=6; i++)
{
if (myRoot.hit.hitTestPoint(myRoot.mouseX, myRoot.mouseY, true))
{
if (myRoot["rect"+i].hitTestPoint(myRoot.mouseX, myRoot.mouseY, true))
{
var newx = (myRoot.sp-(75*(i-1)))-rect1.x;
rect1.x += newx/speed;
var nwidth = targetwidth-myRoot["rect"+i].width;
myRoot["rect"+i].width += nwidth/speed;
}
else
{
var nwidth2 = initialwidth-myRoot["rect"+i].width;
myRoot["rect"+i].width += nwidth2/speed;
}
}
else
{
newx = myRoot.sp-rect1.x;
rect1.x += newx/(speed+50);
nwidth2 = initialwidth-myRoot["rect"+i].width;
myRoot["rect"+i].width += nwidth2/(speed-1);
}
if(i < 6)
{
myRoot["rect"+(i+1)].x = myRoot["rect"+i].x+myRoot["rect"+i].width;
}
myRoot["movie"+(i)].x = myRoot["rect"+i].x-1;
}
};
—————————
There is a slight problem here, which also exists in the original AS2 version. If you expand the rightmost bar, then let it collapse back, but VERY quickly go back into the active area before it has managed to collapse, it gets stuck. This is due to the “box” mc’s (rect[i]), as they move to the left and leave an uncovered area. I still have not managed to sort it out. Other than that - beautiful script