CSS - Um resultado no FF e outro no Chrome ...
Boa noite pessoal,
Depois de muita luta, terminei o site da empresa da minha tia ... ufa ... O problema é que não consigo entender onde está o problema do meu CSS.
O site funciona perfeitamente no Firefox, mas o formulário tem um pequeno problema no Chrome, Ópera e Safari ...
No campo telefone, eu utilizo uma máscara com JQuery. Quando o usuário acessa o campo, a cor da fonte é #000000 e quando ele clica fora do campo, a cor da fonte é #777777. O problema é que nos navegadores, fora o Firefox, a cor da fonte é mais clara e não sei o que está acontecendo.
Vou postar o código CSS e o JQuery ...
CSS ...
* {
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
margin: 0;
padding: 0;
color: #777777;
}
.inputOFF {
background-color: #FFFFFF;
color: #777777;
border:solid 1px #999999;
font-size: 0.8em;
height: 20px;
width: 238px;
padding-top: 1px;
margin-left: 1px;
padding-left: 1px;
}
.inputON {
background-color: #FFFFB2;
color: #000000;
border:solid 1px #999999;
font-size: 0.8em;
height: 20px;
width: 238px;
padding-top: 1px;
margin-left: 1px;
padding-left: 1px;
}
.inputOK {
background-color: #FFFFFF;
color: #000000;
border:solid 1px #999999;
font-size: 0.8em;
height: 20px;
width: 238px;
padding-top: 1px;
margin-left: 1px;
padding-left: 1px;
}
JQuery ...
$("[name='telefone']").on("focusin",function(){
$(this).removeClass("inputOFF").addClass("inputON");
$(this).attr("placeholder","");
$(this).mask("(99) 9999-9999");
});
$("[name='telefone']").on("blur",function(){
var textoTelFixo = "Telefone fixo ...";
var placeholder = $(this).attr("placeholder");
if (placeholder == "") {
$(this).unmask();
$(this).removeClass("inputON").addClass("inputOFF");
$(this).attr("placeholder",textoTelFixo);
} else {
$(this).removeClass("inputON").addClass("inputOK");
}
})
Caso alguém queira ver o site no ar, é o www.totalit.com.br/web ...
Todos os campos funcionam normalmente, menos o do telefone. Seria algum problema de efeito cascata ou algo assim?!
Obrigado pela ajuda,
Hiccup
Discussão (5)
Carregando comentários...