2007-10-24 00:29:36
Categoria: Spry
Com o novo Dreamweaver CS3 você é capaz de criar efeitos DHTML em poucos cliques. É possível criar diversos efeitos configuráveis com bastante liberdade. Aprenda com esse tutorial como utilizar todos os efeitos disponíveis.
Os efeitos podem ser chamados por qualquer evento, por exemplo: onclick, onmouseouver. Porém nem todos os objetos podem receber efeitos, você deve observar se a tag suporta a animação aplicada. Veja a baixo onde encontrar o painel de Effects do Dreamweaver CS3:

Atalho: Shift+F4
Agora é só escolher em que objeto você quer aplicar o evento para chamar o respectivo efeito, depois você poderá configurar o efeito e definir em que elemento ele será executado. Normalmente se aplica efeitos a tags <div> que possuem um id único. Veja nosso exemplo.
No exemplo criei links onde os eventos são onclick, quando são clicados, e são aplicados ao corpo da página. Para isso basta você selecionar o link desejado, ir à opção Tag > Behaviors > + > Effects > Appear/Fade, em seguida aparecerá uma tela de configuração, veja abaixo:

Target Element: Define onde será executado o efeito.
Effect duration: Duração em milissegundos.
Effect: Define o efeito usado, nesse caso pode ser Appear ou Fade.
Fade from: Transparência inicial.
Fade to: Transparência final.
Toggle effect: Marcando essa opção você permite que o efeito seja revertido caso o evento seja chamado outra vez.
Depois de configurar as variáveis do Spry Effects clique em OK. Por padrão o evento criado é onclick, mas você pode modificá-lo facilmente no painel Behaviors e até criar novos eventos no mesmo elemento, veja na figura abaixo:

Com isso você já é capaz de aplicar qualquer efeito em suas página HTML em poucos cliques. Este tutorial termina por aqui, confira nosso exemplo com todos os efeitos disponíveis no Dreamweaver CS3.
© 2007 - Dreamwaver CS3