Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

victor2dm

Diferença entre onmousemove e onmouseover

Por , em Javascript

Recommended Posts

victor2dm    2

victor2dm
Postado

Olá, segue uma documento com três funções.

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <title>JavaScript #2</title>

    <script type="text/javascript">

        function acendeLampada(){
            document.getElementById ("luz").src = "../_imagens/lampada-acesa.jpg";
        }

        function apagaLampada() {
            document.getElementById("luz").src = "../_imagens/lampada-apagada.jpg";
        }

        function quebraLampada() {
            document.getElementById ("luz").src = "../_imagens/lampada-quebrada.jpg";
        }

    </script>
</head>
<body>
      <h1>Acenda a Lâmpada!</h1>
 <img src="../_imagens/lampada-apagada.jpg" id="luz" onmouseover="acendeLampada()" onclick="quebraLampada()" onmouseout="apagaLampada()">


</body>
</html>

Na tag img, quando coloco "onmousemove", a função quebraLampada não funciona de jeito nenhum.

já quando coloco "onmouseover", funciona corretamente.

 

Alguem pode me explicar o por quê?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Rafael Sirotheau    43

Rafael Sirotheau
Postado

Mas, afinal, quem chama quebraLampada?

No seu código, a função é chamada onclick. Mas, na sua duvida, você fala onmouseover.

Afinal, como você gostaria que ficasse seu código?

Compartilhar este post

Link para o post
Compartilhar em outros sites

victor2dm    2

victor2dm
Postado

É o seguinte. A função quebraLampada é pra mudar a imagem para uma lâmpada quebrada no click "onclick". Porém, na função acendeLampada, o tutorial que me foi passado, eu teria que usar onmousemove nela, sendo assim, quando passasse o mouse, mudaria para uma lampada acesa. Porém, se eu usar onmousemove na função acendeLampada, automaticamente minha função quebraLampada para de funcionar, funciona somente com onmouseover

 

O tutorial que eu sigo funciona corretamente com onmousemove, mas foi gravado em 2013 (Projeto curso em vídeo).

 

Qual a diferença dos dois? Surgiu alguma mudança nesse parâmetro de lá pra cá?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Rafael Sirotheau    43

Rafael Sirotheau
Postado

Ah... Agora entendi.

Bom, não é que ela pare de funcionar. Acontece que o click acaba disparando também a mousemove, sendo assim, apesar de você 'não ver', a função do click é sim chamada, porém, a do mousemove é chamada logo em seguida.

Veja: http://jsfiddle.net/p1v7ytcc/

Ative o console do seu navegador. Você perceberá que a função do quebraLampada esta, sim, sendo chamada, porém, a função acendeLampada é chamada em seguida.


A diferença é que com mousemove, a função será chamada sempre que detectar o movimento do mouse, o que não faz sentido pra essa sua aplicação, sendo que chamar apenas no mouseover (ou mouseenter) seria suficiente.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito