Проблема с размером фона в IE8

В настоящее время я создаю сайт параллакса, он работает во всех браузерах, кроме IE8, из-за использования размера фона.

Я пробовал фильтры ms, просто интересно, есть ли у кого-нибудь еще решение.

section {
width: 100%;
position: relative;
overflow-x: hidden;
z-index: 0;

}

.parallax__one {
background: url("../Images/parallex__bg__1.png") 0px 0 no-repeat fixed;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(     src='../Images/parallex__bg__1.png', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader( src='../Images/parallex__bg__1.png', sizingMethod='scale')";
    /* background size */
    -webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-ms-background-size: 100% 100%;
-o-background-size: 100% 100%;
background-size: 100% 100%;

}


css parallax internet-explorer-8
person user1970409    schedule 14.01.2013    source источник
comment
Я нашел отличный сайт под названием stackoverflow stackoverflow. ком/вопросы/2991623/   -  person DavidB    schedule 14.01.2013
comment
js.background не будет работать, так как использует изображение с z-индексом, но из-за создания эффекта параллакса его необходимо установить в качестве фона в css.   -  person user1970409    schedule 14.01.2013
comment
@ user1970409 столкнулся с той же проблемой. Вы нашли какие-то решения?   -  person Tamara    schedule 21.01.2014
comment
В конце концов я исправил это, я думаю, это было связано с шириной   -  person user1970409    schedule 14.03.2014

Ответы (1)


arrow_upward
0
arrow_downward

background-size не работает в IE8

Вам придется использовать что-то вроде этого polyfill.

https://github.com/louisremi/background-size-polyfill

Инструкция из ридми:

Загрузите backgroundsize.min.htc на свой веб-сайт вместе с .htaccess, который отправит MIME-тип, требуемый IE (только для Apache — он встроен в nginx, node и IIS).

Везде, где вы используете background-size в своем CSS, добавьте ссылку на этот файл.

.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);
}

Элементы, стилизованные таким образом, должны иметь position: relative; или position: fixed; и z-индекс. Если нет, им будут присвоены position: relative; и z-index: 0;.

person ryanwinchester    schedule 19.03.2014