Wednesday, February 08, 2006

Todos los que hagáis desarrollado alguna aplicación web (sea con ASP.NET o con cualquier otra tecnología), habreis sufrido la compatibilidad entre los distintos navegadores. Anteriormente eran sólo problemas de javascript, pero ahora se unen las distintas interpretaciones de CSS que cada navegador realiza.

Si Miguel comentaba en este post que IE7 Beta 2 Preview no era compatible con determinados hacks CSS de IE6 (y IE7 Beta 1) y que muchas aplicaciones que funcionaban bien en IE6 no lo hacen en IE7 Beta 2, algo parecido ha sucedido entre Firefox 1.0.x y Firefox 1.5. Firefox 1.5 es ahora más estándar pero a costa de que determinadas páginas que se veían bien en Firefox 1.0.x dejen de verse bien en Firefox 1.5.

En una aplicación en la que estoy desarrollando nos ha sucedido esto, y nos hemos visto en la necesidad de detectar el navegador desde javascript, para poder modificar determinados estilos y hacer que la página se vea "bien" en todos los navegadores. Os paso el código de la función por si os interesa. Sólo distingue entre "internet explorer", "opera", "Firefox 1.0.x" y "Firefox 1.5". Está probada en IE6, Opera 8.02, Firefox 1.0.5 y Firefox 1.5. No puedo asegurar como se comporta con versiones anteriores o posteriores de los navegadores.

Para detectar el navegador no utiliza navigator.appName, sinó que comprueba que ciertos objetos javascript propios de cada navegador existan o no...

  function detectBrowser() {
    var ie = document.all != undefined;
    var opera = window.opera != undefined;
   
    if (opera) return "opera";
    if (ie) return "ie";
    if ((window)&&(window.netscape)&&(window.netscape.security)) {
      if (window.XML) {
        return "firefox15";
      }
      else return "firefox10";
    }
    return "ie";      // Si no sabemos que navegador es, devolvemos ie.
  }