Como mudar o botão no mouseover

Você pode animar texto, imagens e botões na sua página Web com o evento MouseOver. Ele permite que você manipular o código HTML com base em ações de um usuário. MouseOver trabalha lado a lado com o evento MouseOut. MouseOver funciona quando o mouse rola sobre um objeto, enquanto MouseOut funciona quando o objeto já não está seleccionada. Você pode usar MouseOver para alterar o texto e cor das teclas com algumas linhas de javascript.

  • Inicie um editor de texto, como o Bloco de Notas, TextPad ou EditPad. Selecione "Arquivo" e "Abrir" no menu e clicar duas vezes no arquivo HTML que você deseja modificar.

  • Rolar para o tag do seu arquivo, onde o botão vai.

  • Insira o seguinte código para alterar o texto do botão com o mouse:

  • Substituir "Clique para mudar Me" com o texto original, que exibe antes do MouseOver. Substituir "On" com o texto que aparece quando você rola sobre o botão. Substituir "Off" com o texto que aparece quando o mouse rola para fora do botão.

  • Insira o seguinte código para mudar a cor do botão com o mouse. A cor original do botão é vermelho.

    onmouseover = "this.style.backgroundColor = `blue`"

    onmouseout = "this.style.backgroundColor =" amarelo "" />

  • Substitua o "vermelho" com a cor original do botão antes do MouseOver. Substitua o "azul", com a cor que aparece quando você rolar sobre o botão. Substitua o "amarelo" com a cor que aparece quando o mouse rola para fora do botão.

De esta maneira? Compartilhar em redes sociais: