Detecta compatibilidad con fondo: tapa

¿Qué es una forma segura de detectar compatibilidad con CSS3 de fondo: tapa, especialmente en IE < 9?Detecta compatibilidad con fondo: tapa

siguiente prueba devuelve un falso positivo en el IE < 9, ya que en realidad establece fondo de tamaño a cubierta:

div.style.backgroundSize = 'cover';

El único resultado cierto consigo cuando las pruebas de:

if ('backgroundSize' in div.style)

Pero de acuerdo con el sitio http://www.standardista.com/css3/css3-background-properties/#bg11, IE 6/7/8 debe devolver auto, solo cubierta y contienen no son compatibles.

Editar:

me gustaría usar mi propia solución, pero he comprobado el code used by Modernizr. Parece que utilizan la misma técnica que me da resultados falsos positivos en el IE < 9: Establecer backgroundSize = 'cobertura' y para verificar si style.backgroundSize == 'portada'.

Ver mi JSFiddle.

Fuente

2012-09-03 John B.

Si utiliza Modernizr se puede descargar sólo el código necesario para realizar este tipo de tareas

http://modernizr.com/download/#-backgroundsize-testprop-testallprops-domprefixes

a continuación, puede probar con

if (Modernizr.backgroundsize) { 
    /* backgroundSize supported */ 
}

Fuente

2012-09-03 08:50:16 fcalderan

Gracias Fabricio. Me gustaría utilizar mi propia solución, pero he comprobado su código: https://github.com/Modernizr/Modernizr/blob/master/feature-detects/css-backgroundsizecover.js Parece que usan un código similar que me da el falso positivo: configure el estilo y luego busque style.backgroundSize == 'cover'. –

@JohnB. esta parece ser su prueba para 'cubrir' https://github.com/Modernizr/Modernizr/blob/master/feature-detects/css/backgroundsizecover.js – eyelidlessness

Si usted está tratando de detectar bajo funcionamiento navegadores para evitar tener una imagen sello atrapados en el medio de las cosas, entonces uno solución rápida y sucia es

var rules = document.styleSheets[0].cssRules;

Si no está definida, entonces usted sabe que tiene un navegador de bajo funcionamiento y probablemente debería ir con su enfoque de reserva. YMMV.

Fuente

2013-05-02 22:17:24

Este es un mal consejo. La presencia de una API no determina la presencia de otra API. Lo mejor es usar la detección de características adecuada al probar las propiedades disponibles. Esto es completamente posible sin hacer suposiciones extrañas sobre dos API no relacionadas. – eyelidlessness

-2

Esto es con javascript solo, sin jQuery simplemente comprobar la versión de navegador que delealing con

//check if Is bad IE. 
var noBGSizeSupport = window.attachEvent && !window.addEventListener 

if(noBGSizeSupport){ 
    //does not support BG size property 
} else { 
    // supports background size property 
}

Fuente

2014-11-01 12:10:29 webicy

Es necesario comprobar si BackgroundSize existe como una propiedad de estilo antes de instalarla.

var supported = ('backgroundSize' in document.documentElement.style); 
if(supported){ 
    var temp = document.createElement('div'); 
    temp.style.backgroundSize = 'cover'; 
    supported = temp.style.backgroundSize == 'cover'; 
}; 
return supported;

Fuente: http://upshots.org/javascript/javascript-detect-support-for-background-size-cover

Antes de que esto también puede ser que desee probar la detección con CSS.supports(). ver MDN: https://developer.mozilla.org/en-US/docs/Web/API/CSS/supports

Fuente

2016-10-27 18:12:06

Detecta compatibilidad con fondo: tapa

Respuesta

Cuestiones relacionadas