Como criar um rollover de imagem usando a programação html

Linguagem de hipertexto (HTML) é uma linguagem de computador que é usado para criar páginas Web. Saber como usar códigos HTML pode ajudá-lo a manipular suas configurações de página. Você pode criar um link de imagem que vai mudar quando os visitantes mover o mouse sobre o link. rolar imagens podem ser criados usando javascript. Você também pode criar sobreposições de imagem para itens nos menus. Quando os visitantes rolar o mouse sobre os itens do menu, o item de menu ficará destacada. Criando sobreposições de imagem é uma boa maneira de dar suas páginas um apelo mais profissional.

instruções

  1. Inicie o processador de texto ou editor de texto que você usará para criar sua página da Web e abra a página. Adicionar a imagem desejada e incluí-lo no interior da

    tag. Após o nome da imagem, tipo NAME ="rolar".

  2. Digitar antes de o

    tag. Substitua o ponto de interrogação com o endereço da página da Web que você deseja ter aparecer quando um visitante clica na imagem. Digitar
    após a imagem.

  3. Verifique se o seu texto é semelhante ao seguinte:




  4. Digite onmouseover = `rollover.src ="?" `Dentro da tag. Substituir o ponto de interrogação com a localização da imagem que você deseja ter aparecer quando um visitante move o mouse sobre a imagem original.

  5. Digite onmouseout = `rollover.src ="?" `Substituir o ponto de interrogação com a localização da imagem que foi adicionado na Etapa 1.

  6. Verifique se o seu texto é semelhante ao seguinte:
    onmouseout = "rollover.src ="images / foto.jpg" `Gt;


  7. Abra um novo navegador da Web para verificar se a sua página da Web exibe a imagem que você está usando para a sua imagem de sobreposição. Teste o seu site e verificar se os visitantes podem mover o mouse sobre a imagem e vai mudar a imagem que você especificou.

dicas & avisos

  • Você deve tentar a sua página da Web em vários navegadores para ver como cada navegador exibirá sua página.
  • Crédito da foto Comstock / Comstock / Getty Images
De esta maneira? Compartilhar em redes sociais:

LiveInternet