3

私は現在視差サイトを構築しています。背景サイズを使用しているため、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%;

}

4

1 に答える 1

0

background-size IE8では機能しません

このポリフィルのようなものを使用する必要があります。

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

readmeからの指示：

IEに必要なmimeタイプを送信するWebサイトにアップロードbackgroundsize.min.htcします.htaccess（Apacheのみ-nginx、ノード、IISに組み込まれています）。

background-sizeCSSで使用するすべての場所で、このファイルへの参照を追加します。

.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;orposition: fixed;とz-indexが必要です。position: relative;そうでない場合は、とが与えられz-index: 0;ます。

于 2014-03-19T22:15:36.130 に答える