Como fazer uma imagem flash rollover

Com o Flash, é possível criar efeitos loucos que correspondem ao que outros programas como o javascript são capazes de fazer. imagens de sobreposição pode ser usado para criar efeitos em um site, ou eles podem ser usados ​​como um meio para navegar para outras seções de um site dinâmico. Usando o ActionScript permite um efeito de rolagem para ser mais versátil além de garantir que a animação continua pequena. Apenas algumas linhas de escrita são necessários para mover um objecto de estado A para B para C.

1

Abra um novo arquivo Flash Actionscript 3.0.

2

Importar suas imagens. Isto é feito indo para o menu "Arquivo," "Importar" e "Importar para biblioteca."

3

Selecione a linha do tempo e mudar o nome de “Layer 1” com “1.”

4

Arraste uma imagem a partir da biblioteca para o palco.

5

Converter a imagem em um símbolo. Isto é feito pressionando F8 ou ir para o menu "Inserir" e "New Symbol."

Video: Animação CSS - Efeito de legenda em imagens (Caption Hover Effects)

6

Nomeie o símbolo “Imagem 1” e marque “clipe de filme” para convertê-lo em um clipe de filme.

7

Clique "ESTÁ BEM." Um clipe de filme com o nome “Imagem 1” aparece na biblioteca.

8

Dê o clipe de filme um nome de instância “Image1_mc." Fazer isso sob o painel “Propriedades”, localizado abaixo do palco sob a guia “Propriedades”.

9

Selecione o quadro 30 na linha do tempo e bater F5 para adicionar uma moldura.

10

Criar animação clicando com o botão direito em qualquer lugar entre o quadro 1 e 30 e selecionando “Create Motion Tween."

11

Selecione o quadro 30.

12

Selecione a imagem no palco e mudar sua configuração Alpha para 0 por cento, indo para a guia “Propriedades” em “cores”. A imagem no palco é agora invisível.

13

Bloquear o “Imagem 1” camada e insira uma nova camada “Imagem 2.” Use o “bloquear / desbloquear todos Layers” ícone acima das camadas.

14

Selecione o quadro 55 da “Imagem 2” camada e aperte F5.

15

Selecione o quadro 25 e aperte F6. Este insere uma armação chave para o quadro seleccionado.

16

Arraste “Imagem 2” para o F8 palco e imprensa.

17

selecionar "clipe de filme" e dar-lhe um nome de instância “Image2_mc."

18

Criar uma interpolação de movimento entre a frame 25 e 55.

19

Selecione o quadro 25 e a imagem no palco e altere a configuração Alpha para 0 por cento.

20

Selecione o quadro 30 e a imagem no palco e dar-lhe um ambiente Alpha de 100 por cento.

21

Selecione o quadro 55 e a imagem no palco e definir a configuração Alpha para 0 por cento.

22

Repita os passos acima para mais imagens adicionadas. Insira uma nova camada chamada “Ações” e pressione F6 no frame 30 e 55 para adicionar quadros-chave.

23

Clique no quadro 1 do “Actions” camada e pressione F9 para adicionar o seguinte código:
Pare()
IR
image1_mc.addEventListener (MouseEvent.MOUSE_OVER, imageOver)
IR
imageOver função (evento: MouseEvent): void {
Toque()
IR
}

24

Selecione o quadro 30 da “Actions” camada e insira o código abaixo:
Pare()
IR
image2_mc.addEventListener (MouseEvent.MOUSE_OVER, imageOver2)
IR
função imageOver2 (event: MouseEvent): void {
Toque()
IR
}

Escolha armação 55 e sob a camada de ações inserir esta linha de código:
Pare();

25

Teste o filme pressionando “Ctrl + Enter”. Seu efeito de imagem rollover agora deve funcionar.
Publicar a animação vai "Arquivo" e "Publicar."

Video: Tutorial (Edge Animate) - Criando botão rollover

Gorjeta

  • Verifica Você pode ter tantos objetos quanto possível deslizando para dentro e para fora. Usar gráficos, texto de entrada e botões embutidos no símbolo de clipe de filme para criar animações dinâmicas.

Unid você precisará

Video: CRIANDO MENU COM ROLLOVER FLASH

Referências

  • ligação Eu gosto de inflamação: Criar uma imagem Rollover Effect
  • ligação Flash Rollover

Sobre o autor

David Gitonga é um web designer e tem um grau de associado em tecnologia da informação e eletrônica. Ele tem mais de dois anos de experiência em Web design e conteúdo escrito Web e mais de cinco anos de experiência em eletrônica. Ele tem escrito uma série de artigos para vários sites.


Artigos relacionados