IE 8以下でbackground-sizeをサポートしない互換案について
1784 ワード
DIVの幅に対応する背景画像を指定する場合、background-size:100%またはbackground-size:coverを使用して、このDIVを背景に敷くことができます.
しかし、IE 8を含むIE 8以下のCSS属性はサポートされていない.どうやって解決しますか?IEのAlphaImageLoaderフィルタはこの問題を解決することができ、詳細は参照することができる.https://msdn.microsoft.com/zh-cn/library/ms532969(v=vs.85).aspx
ここではその使い方について簡単に説明します
sPropertiesにはenabled、sizingMethod、srcの3つのプロパティが含まれます. enabled:ブール型、trueまたはfalse、フィルタが 有効かどうかを示す sizingMethod:crop(裁断画像適応容器)、image(容器適応画像自体のサイズ)、scale(スケーリング画像適応容器) を使用できる画像適応容器方法を示す. src:ロードする画像パスは、そのページに対してでなければならないので、CSSで絶対パスを使用する必要があると指定した場合、CSSファイルに対する相対パスを使用できない場合、エラーが発生する可能性があります.
例:
しかし、IE 8を含むIE 8以下のCSS属性はサポートされていない.どうやって解決しますか?IEのAlphaImageLoaderフィルタはこの問題を解決することができ、詳細は参照することができる.https://msdn.microsoft.com/zh-cn/library/ms532969(v=vs.85).aspx
ここではその使い方について簡単に説明します
HTML :
JS :
object .[style](https://msdn.microsoft.com/zh-cn/library/ms528442(v=vs.85).aspx).filter ="progid:DXImageTransform.Microsoft.AlphaImageLoader(sProperties)"
sPropertiesにはenabled、sizingMethod、srcの3つのプロパティが含まれます.
例:
var bToggle = 1
<!-- Toggle the sizingMethod property to resize the image. -->
function fnToggle(oObj) {
if (bToggle) {
bToggle = 0;
oDiv.filters(0).sizingMethod="image";
oObj.innerText='Enlarge It';}
else {
bToggle = 1;
oDiv.filters(0).sizingMethod="scale";
oObj.innerText='Make Normal';}
}