Um Pulldown Menu muito eficaz e muito simples de fazer, utilizando apenas 3 layers.
1. Na primeira layer (do botão menu) que nomeei “menu” será inserida uma imagem ou texto (se for texto, nas propriedades insira “#” como link), onde se clica com o rato para aparecer as opções do menu; a layer “menu” terá de ter um valor “z” (profundidade) superior a todas as outras layer, para que as outras layer passem por baixo dela.
2. A segunda layer nomeada “opcao” será a das opções, esta layer ou a imagem inserida nela terá uma largura igual ou inferior a layer “menu“. Posiciona a layer “opcao”, debaixo da layer “menu“, sem deixar espaço entre elas e com a mesma.
3. A última layer nomeada “esconder” serve para esconder a 2ª (“opcao“) na parte que está por cima da layer “menu“. Por isso ela deverá ser criada por cima da layer “menu“, sem espaço entre elas, ser um pouco mais larga e ter como cor de fundo a mesma do <body>. Como ela vai esconder a layer “opcao“, o seu valor “z” terá de ser superior ao “z” ao da layer “opcao“.
4. Seleccionas a layer “opcao“, abra a janela da timeline (Window » Timeline) crias um objecto. Como a layer já está na sua posição final, selecciona a 1ª keyframe no objecto e moves a layer para cima, até estar completamente por cima da layer “menu“. E a 1ª timeline está feita.
5. Agora temos de chamar a timeline: selecciona a layer “menu”, e vais aplicar 2 behavior:
- Na janela dos behaviors vai a Timeline » Go to timeline frame – escolhas a timeline na posição frame nº1.
- Timeline » Play timeline – escolhas a timeline.
- O event será “on click“.
6. Para voltar a esconder a layer com as opções crias uma 2ª timeline e dentro dela crias um objecto relativo a layer “opcao“, em que será igual a 1ª timeline mas com as posições trocadas, isto é, a 1ª keyframe terá de ter as mesmas propriedades de posição do que a 2ª keyframe da primeira timeline e a 2ª keyframe terá de ter as mesmas propriedades da 1ª keyframe da primeira timeline.
7. Agora é aplicar esta timeline a layer “opcao” e ao <body>:
Selecciona a layer “opcao” e vais aplicar 2 behavior:
- Na janela dos behaviors vai a Timeline » Go to timeline frame – escolhas a 2ª timeline na posição frame nº1.
- Timeline » Play timeline – escolhas a 2ª timeline.
- O event será “on click“.
Selecionas o <body> (clica no fundo) e aplica os mesmos 2 behaviors da layer “opcao“, só que agora o event será “on focus“.
Terminamos o menu. Faça o teste para ver funcionando.
