¿Cómo puedo orientarme únicamente a Internet Explorer 10 para determinadas situaciones, como CSS específico de Internet Explorer o código JavaScript específico de Internet Explorer?
¿Cómo puedo orientarme únicamente a Internet Explorer 10 para determinadas situaciones, como CSS específico de Internet Explorer o código JavaScript específico de Internet Explorer?
Intenté esto, pero no funciona:
<!--[if IE 10]> <html class="no-js ie10" lang="en"> <![endif]-->
<!--[if !IE]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
Internet Explorer 10 ignora los comentarios condicionales y utiliza en <html lang="en" class="no-js">
lugar de <html class="no-js ie10" lang="en">
.
Aceptado
No usaría JavaScript navigator.userAgent
o $.browser (que usa navigator.userAgent
) ya que puede ser falsificado.
Para apuntar a Internet Explorer 9, 10 y 11 (Nota: también la última versión de Chrome):
@media screen and (min-width:0\0) {
/* Enter CSS here */
}
Para apuntar a Internet Explorer 10:
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS here */
}
Para apuntar al navegador Edge:
@supports (-ms-accelerator:true) {
.selector { property:value; }
}
Fuentes:
- Mover CSS específico de Internet Explorer a bloques @media
- Cómo apuntar a Internet Explorer 10 y 11 en CSS
- Hacks de CSS para Windows 10 y el navegador web Edge de Microsoft
Encontré una solución en este sitio donde alguien tenía un comentario valioso :
La solucion es:
if (Function('/*@cc_on return document.documentMode===10@*/')()){
document.documentElement.className+=' ie10';
}
Él
- no necesita comentarios condicionales;
- funciona incluso si se eliminan comentarios mediante compresión/procesamiento;
- no se agregó ninguna clase ie10 en Internet Explorer 11;
- es más probable que funcione según lo previsto con Internet Explorer 11 ejecutándose en el modo de compatibilidad de Internet Explorer 10;
- no necesita una etiqueta de secuencia de comandos independiente (simplemente se puede agregar a otro código JavaScript en el encabezado).
- no necesita jQuery para probar