4

Eu possuo uma função em JavaScript que é ativada através do evento onmouseover em um tabela com registros, o campo muda de cor quando passo o mouse, até ai tudo bem o problema é que ela só funciona nos navegadores IE e google chrome, já no Mozilla ela não funciona o que eu faço?

onmouseover="mOvr(this,'#A8A8A8');"

function mOvr(src, clrOver) {
    if (!src.contains(event.fromElement)) {
        src.bgColor = clrOver;
    }
}
2
  • Qual versão especifica do firefox? no console de erros aparece alguma mensagem?
    – rray
    28/01/2015 às 12:08
  • 1
    versão 35.0.1 e aparece ReferenceError: event is not defined scripts.js:8:8 no console.
    – jp_almeida
    28/01/2015 às 12:13

2 Respostas 2

5

Isto é um bug antigo conhecido. O problema é que o Firefox não usa event.fromElement (nem .toElement) e os outros não usam event.relatedTarget que o Firefox usa... assim tens de detectar essa feature e adaptar o código e comparar se o event.relatedTarget e o event.target são o mesmo. Podes dar uma olhada ao código fonte do jQuery.

Podias usar uma função deste tipo para corrigir isso:

function fix(event) {
    if (event.type == 'mouseenter') {
        event.fromElement = event.relatedTarget;
    }
    if (event.type == 'mouseleave') {
        event.toElement = event.relatedTarget;
    }
}

Mas vendo que tens !src.contains(event.fromElement) presumo que queiras esse comportamento só no mouseenterdo src (ou seja src não contém o elemento de onde o mouse veio), então acho melhor usares mesmo o onmouseenter="" e se quiseres repôr, usando o onmouseleave. Algo como isto: http://jsfiddle.net/far4q1ja/

Porém o mais sensato seria usar CSS para efeitos de mousehover... se puderes vai por essa via e dá classes de CSS a esses elementos para poderes escrever regras no ficheiro CSS.

PS: O erro que referiste ReferenceError: event is not defined scripts.js:8:8 é porque estás a usar event dentro da função sem teres passado um argumento com esse nome. Assim tens de defenir a função com esse parâmetro:

function mOvr(src, clrOver, event) {

e depois no inline usar onmouseover="mOvr(this,'#A8A8A8', event);".

3
0

Eu fiz assim deu certo, só que não tem como passar no parâmetro do evento.

function mOvr(obj,color) {
    obj.style.backgroundColor = "#A8A8A8";
}

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .