on-load-remove-class="default-font">
×
Loading ...

Como alterar o ponteiro do mouse utilizando o OnMouseOver

Atualizado em 19 julho, 2017

O evento "OnMouseOver" é desencadeado quando um usuário passa o ponteiro do mouse sobre um elemento de uma página. Isso pode ocorrer com qualquer elemento, como uma imagem, um botão, uma tabela ou a própria página. É possível alterar o ícone exibido ao usuário quando o ponteiro do mouse passa por cima desses elementos utilizando Javascript nas propriedades de controle. O evento "OnMouseOver" é utilizado com "OnMouseOut", o qual é desencadeado quando o ponteiro do mouse já não está mais sobre o elemento, e é utilizado para que o ícone do ponteiro volte à sua imagem original.

Instruções

O evento "OnMouseOver" é desencadeado quando você passa o mouse sobre um elemento designado (computer mouse image by Edyta Anna Grabowska from Fotolia.com)
  1. Abra o arquivo HTML com seu editor de textos preferido. Role a tela até o elemento HTML que você quer editar. Pode ser qualquer elemento na página. Neste exemplo, será utilizada a etiqueta "", própria para imagens em páginas.

    Loading...
  2. Acrescente o evento "OnMouseOver" a esse elemento. Cada elemento na página é programado com eventos internos. Isso significa que você simplesmente adicionará o texto do evento às propriedades da etiqueta para notificar o navegador que o código deve ser executado. O código a seguir é um exemplo de como adicionar o evento "OnMouseOver" à etiqueta de imagem:

  3. Atribua o código Javascript ao evento "OnMouseOver" que altera o ponteiro do mouse. O código a seguir altera o ponteiro para uma mãozinha quando o usuário passa o mouse sobre a imagem:

  4. Faça com que o ponteiro do mouse volte ao seu ícone original depois que ele não estiver mais sobre o elemento. Se você não configurar o evento "OnMouseOut", o mouse continuará alterado enquanto o usuário navega pela página. O código a seguir faz com que o ponteiro do mouse retorne ao padrão:

Loading...

Referências

Loading ...
Loading ...