Help
Todos aqui devem saber que as pseudo-classes do CSS 2 :hover e :first-child não funcionam direito no IE6 né? A hover só funciona em links.
Porém vossas senhorias já devem conhecer inúmeras ténicas secretas ninja para simular as pseudo classe hover e first-child no IE 6 né? Técnicas com javascript simples, técnicas com libs javascript, arquivo htc, etc
Abaixo eu mostro uma nova técnica que o mico inventou enquanto estava desenvolvendo sua Micox-mini-css-lib (em breve em um blog perto de você).
A vantagem da minha criança é que ela pode ser colocada direto no seu CSS, em qualquer lugar dele (de preferencia no começo ou em comentários condicionais). Ela é baseada em javascript dentro do CSS. Abaixo, o código. Quem não entender me pergunta nos comments.
CÓDIGO
/* Micox Pseudo-class-css2 to IE (MXPC). Activate .hover and .first-child in IE 6 */
* html * { color: expression( (function(who){ if(!who.MXPC){
who.MXPC = '1';
if(who.nodeName != 'A'){
who.onmouseenter=function(){ who.className += ' hover'};
who.onmouseleave=function(){ who.className = who.className.replace(' hover','')}; }
(who==who.parentNode.firstChild) ? who.className += ' first-child' : '';
} } )(this) , 'auto') }
/* exemplo de uso*/
p:first-child , p.first-child { color: red }
li:hover a , li.hover a { color: green; }
* html * { color: expression( (function(who){ if(!who.MXPC){
who.MXPC = '1';
if(who.nodeName != 'A'){
who.onmouseenter=function(){ who.className += ' hover'};
who.onmouseleave=function(){ who.className = who.className.replace(' hover','')}; }
(who==who.parentNode.firstChild) ? who.className += ' first-child' : '';
} } )(this) , 'auto') }
/* exemplo de uso*/
p:first-child , p.first-child { color: red }
li:hover a , li.hover a { color: green; }
"Viiixxxxxx maria, onde eu coloco isso mico?" - Não tema o código Sr.! Apenas coloque ele no começo do seu CSS. Veja esta página de exemplo e zóie o código fonte dela.
