Webpoint

Atire a primeira pedra quem nunca usou um hack, principalmente para o complicado IE6. Underscore, comentários condicionais e por aí vai… Quando meu colega de trabalho apresentou o underscore hack para mim foi uma maravilha, mas também um vício. Passei a usá-lo frequentemente e esquecia que poderia conseguir chegar no resultado, ultrapassar as diferenças de browsers apenas indo mais a fundo. Mas a pressa é a inimiga da perfeição e o underscore “quebrava um galhão”. Resolvi abandoná-lo e testar até o final nos principais browsers. Aprendi muito com isto, descobri a fundo o por que dos problemas e o por que do IE6 renderizar tão diferente do Firefox. Percebi que o IE7 passou a ser mais padrão. Mas as vezes não tem como chegar a um layout comum entre os dois. Então há o recurso conhecido por muitos como comentário condicional. Ele não funcionou para mim em relação ao IE6 e 7, pois o IE7 abria uma tela em branco quando ele era usado.

Com poucas linhas de código, recorri ao Jquery para fazer esta tarefa. Como ele possui funções em seu core para detectar browser e sua manipulação com CSS é bastante intuitiva, resolvi corrigir algumas diferenças do IE6 para os demais com o Jquery. Como é possível?

// Corrigindo Hacks do IE6
var versao = $.browser.version;

if($.browser.msie and versao == 6) {

 // Estilos somente para o IE6

 $("#conteudo_central").css("width","621px");

 $("#navegacao").css("width","267px");

 $(".idioma").css("display","inline");

}

A função $.browser.version retorna o valor inteiro da versão do browser. Assim, para o IE6 a variável versão irá conter o valor 6. No exemplo acima mostrei um hack para corrigir ajustar algumas propriedades CSS para serem aplicadas no IE6. Lembrando que este método está disponível para a versão 1.1.3, antes dele era necessário recorrer a um plugin que extendia as funcionalidades de $.browser.

A função $.browser.msie retorna verdadeiro se o browser for o IE. Assim, a estrutura condicional se torna verdadeira se o browser for o IE e a versão for a 6.

Outros métodos aceitos pela função $.browser

• safari
• opera
• mozilla

O método css do Jquery você atribui propriedades css ao elemento através de dois parâmetros como string, o primeiro é a propriedade e o segundo o valor. Se existirem essas propriedades no CSS o valor final será o do Jquery, pois apesar de ele não inserir o css inline, ele é atribuido depois que o dom estiver carregado. Se ao invés de uma string um número for atribuído ao valor, ele é convertido automaticamente para string.

Não quero de forma alguma incentivar o uso de hacks, pois esta medida tem que ser tomada em último caso. Para todo hack usado tem com certeza uma saída melhor. Mas tem que ser avaliado o tempo e se vale a pena passar dias tentando resolver um bug ou um comportamento não esperado. A desvantagem deste método é que ele não funciona em browsers que não aceitam script ou o navegador esteja desabilitado do uso de javascript. Mas é uma alternativa muito simples e útil. Para quem não está satisfeito com o underscore ou comentários condicionais, está aí mais uma arma no arsenal de hacks a serem usados.