Tutorial conciso do Dreamweaver 4 (8. Adicionar efeitos interativos às páginas da web 2)
Autor:Eve Cole
Data da Última Atualização:2009-05-30 18:35:33
8. Adicione efeitos interativos às páginas da web
Crie efeitos interativos mais complexos
No Dreamweaver, efeitos mais complexos são obtidos por meio de uma função chamada Behaviors, que significa literalmente "comportamento", que também chamamos de respostas a eventos. Através de alterações nos elementos da página web, como movimentação do mouse, cliques e outros “eventos” (Events), acionamento de janelas pop-up, fechamento da página e outras “respostas” (Actions), trata-se de uma resposta a evento. E, felizmente, a produção de “The Act” é quase infalível.
Pressione Shift+F3 para abrir o painel de comportamento, conforme mostrado abaixo:
Adicionar comportamento a uma página da web requer as três etapas a seguir:
1. Selecione os elementos que geram o comportamento, como imagens, texto com links, camadas, etc. Se quiser que o efeito comece a aparecer assim que a página carregar, você pode selecionar Etiqueta 2 na barra de status e pressionar O botão seleciona uma resposta (diferentes elementos têm diferentes respostas correspondentes) e define as propriedades desta resposta na caixa de diálogo subsequente. Segue uma descrição das respostas que podem ser selecionadas:
Chame JavaScript: Chame um pedaço de JavaScript;
Alterar Propriedade: Altere o estilo CSS da tag HTML;
Verifique o navegador: entre em páginas diferentes de acordo com os diferentes navegadores;
Check Plugin: Verifique se o navegador possui os plug-ins necessários;
Controlar Shockwave ou Flash: Controle a reprodução de animação Shockwave ou Flash;
Arrastar Camada: Permite ao visualizador arrastar elementos da camada;
Ir para URL: Link para o URL especificado;
Menu Saltar, Menu Saltar Ir: Menu Saltar e botão Ir;
Abrir janela do navegador: abre uma nova janela do navegador;
Reproduzir som: reproduz som;
Mensagem pop-up: janela pop-up de aviso;
Pré-carregar imagens: Leia as imagens com antecedência;
Definir Imagem da Barra de Navegação: Define a imagem da barra de navegação;
Definir Texto: Exibe o texto em um local específico;
Mostrar Ocultar Camada: Mostra ou oculta a camada;
Trocar imagem, Trocar restauração de imagem: Transforme fotos e restaure fotos originais;
Linha do tempo: Controle a reprodução da linha do tempo;
Validar Formulário: Verifique a veracidade do formulário;
Obtenha mais comportamentos: baixe mais eventos comportamentais.
3. Selecione Eventos para decidir em que circunstâncias a resposta será acionada. Os eventos comuns incluem:
onMouseOver: O mouse se move para o alvo;
onMouseUp: quando o mouse é pressionado e depois o botão esquerdo é liberado;
onMouseOut: quando o mouse se afasta;
onMouseDown: Quando o mouse é pressionado (não é necessário soltar o botão esquerdo);
onClink: quando clicado;
onDblClick: quando clicado duas vezes;
onLoad: Ao carregar uma página web;
onUnload: ao sair da página;
onResize: Quando o visualizador altera o tamanho da janela de navegação;
onScroll: quando o visualizador arrasta a barra de rolagem.