Como faço para o tamanho do plano de fundo funcionar no IE?

Existe alguma maneira conhecida de fazer o estilo CSS background-sizefuncionar no IE?

Um pouco tarde, mas isso também pode ser útil. Há um filtro do IE, para o IE 5.5+, que você pode aplicar:

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='images/logo.gif',
sizingMethod='scale');

-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='images/logo.gif',
sizingMethod='scale')";

No entanto, isso dimensiona a imagem inteira para caber na área alocada; portanto, se você estiver usando um sprite, isso poderá causar problemas.

Especificação: AlphaImageLoader Filter @microsoft

Criei jquery.backgroundSize.js : um plug-in jquery de 1,5K que pode ser usado como um fallback do IE8 para os valores "cover" e "contem". Dê uma olhada na demo .

Graças a este post, meu CSS completo para a felicidade entre navegadores é:

<style>
    .backgroundpic {
        background-image: url('img/home.jpg');
        background-size: cover;
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
        src='img/home.jpg',
        sizingMethod='scale');
    }
</style>

Faz tanto tempo que eu trabalhei neste código, mas gostaria de adicionar mais compatibilidade ao navegador. Anexei isso ao meu CSS para obter mais compatibilidade com o navegador:

-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;

Ainda mais tarde, mas isso também pode ser útil. Existe o plugin jQuery-backstretch-plugin que você pode usar como um polyfill para background-size: cover. Eu acho que deve ser possível (e bastante simples) pegar a propriedade css-background-url com o jQuery e alimentá-lo com o plug-in jQuery-backstretch. Uma boa prática seria testar o suporte ao tamanho do plano de fundo com o modernizr e usar este plugin como substituto.

O backstretch-plugin foi mencionado no SO aqui . O jQuery-backstretch-plugin-site está aqui .

De maneira semelhante, você pode criar um plugin ou script jQuery que faça o tamanho do plano de fundo funcionar em sua situação (tamanho do plano de fundo: 100%) e no IE8-. Então, para responder à sua pergunta: Sim, existe uma maneira, mas o ATM não existe uma solução plug-and-play (ou seja, você mesmo precisa codificar).

(aviso: não examinei o backstretch-plugin completamente, mas parece fazer o mesmo que background-size: cover)

Existe um bom polyfill para isso: louisremi / background-size-polyfill

Para citar a documentação:

Faça o upload de backgroundsize.min.htc para o seu site, juntamente com o .htaccess que enviará o tipo MIME exigido pelo IE (somente Apache - ele é construído em nginx, nó e IIS).

Em qualquer lugar que você use o tamanho do plano de fundo no seu CSS, adicione uma referência a este arquivo.

.selector { 
    background-size: cover;
    /* The url is relative to the document, not to the css file! */
    /* Prefer absolute urls to avoid confusion. */
    -ms-behavior: url(/backgroundsize.min.htc);
}

No Windows 7 do IE11, isso funcionou para mim,

background-size: 100% 100%;

você pode usar este arquivo ( https://github.com/louisremi/background-size-polyfill “polyfill de tamanho de plano de fundo”) para o IE8 que é realmente simples de usar:

.selector {
background-size: cover;
-ms-behavior: url(/backgroundsize.min.htc);
}

Eu tentei com o seguinte script -

.selector { 
background-image: url("img/image.jpg");
background-size: 100%;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-repeat: no-repeat;
}

Funcionou para mim!