método getElementById do JavaScript () permite que programadores inspecionar e modificar o encanamento interno de uma página web. Este método tem acesso à interface de programação de aplicativos de uma página da web chamado Document Object Model ou DOM. Com getElementById () , o programador pode alterar a maioria HTML (HyperText Markup Language) informações tag estilo - incluindo imagens de fundo. O JavaScript funções de eventos onMouseOver () e onMouseOut () responder ao movimento do mouse sobre elementos HTML , desencadeando a execução de instruções de JavaScript. As tags HTML devem ser rotulados com um ID único para que o método getElementById () pode encontrar e modificá-los. Coisas que você precisa
editor de texto
dois do mesmo tamanho de imagens de fundo , GIF , PNG ou JPG
Show Mais instruções
1
Inicie o editor de texto que veio com o computador.
2
Digite o seguinte código no editor de texto . Substitua os nomes de imagem " image1.jpg " e " image2.jpg " com os nomes e formato de seus arquivos de imagem de fundo . Ajuste os tamanhos de imagem no " mydiv " Cascading Style Sheet também.
< Tipo style = "text /css " > <-
mydiv {
background-image : . type = "text /javascript " >
função ChangeImage ( linknumber )
{ var
changeimageback ( linknumber )
{ var
id = " mydiv1 " class = " mydiv " onMouseOver = " ChangeImage ('1 ' ); " onMouseOut = " changeimageback ('1' )"> Ligação 1 < /div>
id="mydiv2" class="mydiv" onMouseOver="changeimage('2');" onMouseOut="changeimageback('2')" > Ligação 3 < /div >
Ligação 4 < /div >
3
Clique em " Arquivo", " Salvar". Salvar como " test.html ".
4
Inicie o seu navegador. Clique em " Arquivo", " Abrir arquivo ".
5
Localize e abra o arquivo " test.html " você acabou de criar.
6
Mova o ponteiro do mouse sobre o links para testar a imagem de fundo a mudança .