фильтр: градиент и фон: исправлено

Question

Код:

body { background-attachment: fixed !important; filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#000000,endColorStr=#3d3c3c); }

Градиент не остается фиксированным в IE8, а прокручивается на простой белый фон.Градиенты остаются фиксированными в Firefox и Chrome и прокручивают страницу.

Есть ли способ получить его fixed в IE8?Я даже не подозревал, что это проблема (по словам Google, ничего не могу найти).

Редактировать: я создал тестовую страницу с кодом выше (и довольно большим количеством Lorem Ipsum) и фономбыло исправлено, как и должно быть.Так что это должно быть что-то в моем макете.

Answer 1

Похоже, все, что вам не хватает, это установить высоту тела. Добавление этого стиля работает для меня в IE 8:

html, body {height: 100%}

Итак, используя ваш стиль из скрипки, выглядело бы это так:

html, body {height: 100%}
body {
    background-attachment: fixed !important;
    filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#000000, endColorstr=#ffffff);
}

А вот так будет выглядеть кросс-браузерная версия:

html, body {height: 100%}
body {
    background-attachment: fixed !important;
    filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#000000, endColorstr=#ffffff);
    background-image: -moz-linear-gradient(center top -90deg, #000000, #ffffff);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#000000), to(#ffffff));
}

Очевидно, что вы можете поместить специальный код IE в другое место и загрузить его условно и т. Д.

Это хорошо протестировано в IE 8, Firefox 3.6, Chrome 9 и Safari 5 (Webkit), но не работает в Opera Для Opera, SVG или реального фонового изображения?