Cross-browser
Origem: Wikipédia, a enciclopédia livre.
Cross-browser refere-se à habilidade de um site, Aplicação Web, contructor HTML ou script side-client suportar múltiplos navegadores.
Esta aplicação deve ser construída através de uma forma de programação que utiliza tecnologias compatíveis com qualquer navegador Web que suporte as especificações do W3C.
O termo foi amplamente utilizado no anos 90 por causa da Guerra dos browsers e significava que o site construído com essa ideia tinha a capacidade de ser visualizado tanto pelo Internet Explorer como pelo Netscape Navigator, os principais navegadores na época. Durante esse período novas características foram adicionadas aos navegadores sem qualquer coordenação entre as pessoas envolvidas. Isso fez com que alguns navegadores apoiassem alguma característica em particular e funcionava de forma diferente em cada um.
O termo ainda é utilizado, mas com menos frequência. O principais motivos são:
- As últimas versões do Internet Explorer e do Netscape Navigator têm suporte para HTML 4.0 e CSS 1.
- Melhor compatibilidade da técnica de mainpulação DOM que se tornaram o método preferido para construir scripts para side-client.
- O mercado de navegadores alargou e pediu uma compatibilidade maior com o Cross-browser. Hoje em dia um site normalmente suporta outros navegadores como Firefox, Opera e Safari, além de ser totalmente compatível com o Internet Explorer e Netscape Navigator.
[editar] Exemplos de código Cross-browser
Para compreender o exemplo a seguir é necessário que tenha algum conhecimento básico de HTML e JavaScript:
<div id="sample" style="position : absolute; top : 100px; left : 100px;">some text</div>
O código acima descreve um bloco de texto que deveria ser mostrado com uma distância do topo de 100 pixels e 100 pixels da esquerda. No Netscape Navigator 4, seria possível mover o texto com o seguinte código:
document.layers['sample'].left = 200;
Entretanto, para ter o mesmo resultado no Internet Explorer 4 seria necessário outro código:
document.all['sample'].style.left = 200;
Para o que funcionasse em ambos os navegadores e assim ser Cross-browser seria necessário escrever um outro código:
if (document.all) document.all['sample'].style.left = 200; else if (document.layers) document.layers['sample'].left = 200;
O código seguinte usa a normalização W3C que funciona nos navegadores Mozilla, nas novas versões do Internet Explorer e em várias versões de outros navegadores que seguem as normas da W3C:
document.getElementById('sample').style.left = '200px';
