Utilizando JQuery para eventos do mouse

[ad#texto]

Algumas vezes temos de inserir funções JavaScript nos três eventos de mouse (onMouseOver, onMouseOut e onMouseMove) no mesmo elemento HTML.

Nem é precisa falar que são constantes os problemas de conflitos e quase sempre sofremos para equacionar nossas funções JavaScript para trabalharem atuando no mesmo elemento, em três eventos distintos do mouse sem bloquear ou atrapalhar as execuções uma das outras. Isso sem falar que muitas vezes temos problemas no JavaScript onde um browser executa o outro não ou ainda temos um comportamento alterado.

Como resolver? Simples, utilizando JQuery.

Podemos equacionar o acionamento dos três eventos de mouse de forma simples e o código JavaScript embutido dentro de cada chamada irá ser executado sem conflitar (é claro que se a execução de um atuar sobre o mesmo elemento e da mesma forma a execução mais recente irá sobrescrever a execução mais antiga). Como fica um exemplo de código:

var campoMeu = document.getElementById("campoMeu ");
 
$( campoMeu).mouseover(function(){
  //Seu código de execução aqui
 }).mousemove(function(e){
  //Seu código de execução aqui
 });
}).mouseout(function(){
 //Seu código de execução aqui
});

Viram como fica simples, basta buscar o elemento pelo seu ID e depois atribuir os eventos de mouse utilizando o JQuery.

Petter Rafael
Petter Rafael

Desenvolvedor Web atua com as tecnologias Java e PHP apoiadas pelos bancos de dados Oracle e MySQL. Além dos ambientes de desenvolvimento acima possuiu amplo conhecimento em servidores Apache/Tomcat, Photoshop, Arte & Foto, Flash e mais uma dezena de ferramentas e tecnologias emergentes. Atualmente colabora com o Viablog escrevendo sobre programação e tecnologia.

Assinar blog por e-mail

Digite seu endereço de e-mail para assinar este blog e receber notificações de novas publicações por e-mail.

Junte-se a 323 outros assinantes

Busca

agosto 2020
DSTQQSS
 1
2345678
9101112131415
16171819202122
23242526272829
3031 

Categorias