Criando uma imagem de sobreposição em cs3 dreamweaver

No Dreamweaver, imagens capotamento - como o nome indica - são projetados para reagir quando alguém rola um cursor sobre uma imagem. O efeito pode ser tão dramática como uma imagem de um cão que está sendo substituído por uma imagem de um leão, ou tão sutil quanto a cor de uma palavra mudança como uma imagem substitui outra. De qualquer maneira, o Dreamweaver inclui uma caixa de diálogo especial para sobreposições que torna a criação de um efeito de rollover simples um dos comportamentos mais fácil de aplicar.

Video: criando background em imagem dreamweaver cs4

Para criar uma imagem de sobreposição, usando a caixa de diálogo Imagem cambiável do Dreamweaver Inserir, siga estes passos:

1. Clique para colocar o cursor na página onde você deseja que o rollover a aparecer.

Video: Digitar em cima da imagem no Dreamweaver usando css "Neilon"

efeitos de sobreposição exigem pelo menos duas imagens: uma para o estado inicial e um para o estado de rolagem. Você pode usar duas imagens diferentes ou dois similares, mas ambos devem ter as mesmas dimensões. Caso contrário, você tem alguns efeitos de escala estranho, porque ambas as imagens devem ser exibidas em exatamente o mesmo espaço na página.

2. Escolha Inserir -gt; Imagem Objetos -gt; Imagem cambiável.

A caixa de diálogo Inserir imagem cambiável aparece.

3. Na caixa Nome da imagem, o nome da sua imagem.

Antes que você possa aplicar um comportamento a um elemento, como uma imagem, o elemento deve ter um nome para que o script comportamento pode fazer referência a ela. Você pode nomear elementos que quiser, contanto que você não use espaços ou caracteres especiais.

4. Na caixa de imagem original, especifique a primeira imagem que você quer visível. Use o botão Procurar para localizar e selecionar a imagem.

Se as imagens já não estão em pasta raiz do seu site, o Dreamweaver irá copiá-los para o seu site quando você cria o capotamento.

5. Na caixa Imagem do Rollover, insira a imagem que deseja tornar-se visível quando os visitantes mover seus cursores sobre a primeira imagem.

Video: [Inserindo Links em Imagens] Fazendo Mapeamento de Imagens no Dreamweaver

Novamente, você pode usar o botão Procurar para localizar e selecionar a imagem.

6. Marque a caixa de seleção Imagem Preload Rollover para carregar todas as imagens de sobreposição em cache do navegador quando a página é carregada pela primeira vez.

Se você não optar por fazer esta etapa, os visitantes podem experimentar um atraso porque a segunda imagem não será baixado até um mouse é rolado a imagem original.

7. No Quando clicado, vá para a caixa de URL, digite qualquer endereço da Web ou navegar para localizar outra página no seu site que você deseja vincular.

Se você não especificar um URL, o Dreamweaver insere automaticamente o sinal # como um espaço reservado.

8. Clique em OK.

As imagens são automaticamente configurados como um capotamento.

9. Clique no ícone de globo na parte superior do espaço de trabalho para visualizar o seu trabalho em um navegador e testar como o rollover trabalha.