IE7/8縮放背景圖像其容器寬度的100％

我正在處理縮放圖像的圖像滑塊。當然，這在所有瀏覽器中都可以正常工作，包括IE9 +，但是對於IE7/8，它似乎會縮放圖像以適合容器高度而不是寬度...IE7/8縮放背景圖像其容器寬度的100％

我正在使用以下CSS代碼來縮放圖像。

-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../files/slideshow/3.jpg', sizingMethod='scale')" 
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../files/slideshow/3.jpg', sizingMethod='scale');

我很好奇，如果有人知道的方式由容器而不是使用任何CSS或JavaScript的高度寬度，使這個規模有多大？

你可以在這裏http://kearsargefire.org/

來源

2013-04-22 Robert E. McIntosh

'width：100％;身高：自動;'通常爲我做。 – Blazemonger 2013-04-22 14:06:42

問題是我加了'height：auto;'出現了沒有圖像 – 2013-04-22 14:37:27

什麼是「無償專業人士」？ – Blazemonger 2013-04-22 14:43:18

查看檢查它...

http://css-tricks.com/perfect-full-page-background-image/

HTML

<img src="images/bg.jpg" id="bg" alt="">

CSS

#bg { position: fixed; top: 0; left: 0; } 
.bgwidth { width: 100%; } 
.bgheight { height: 100%; }

SCRIPT

$(window).load(function() {  

     var theWindow  = $(window), 
      $bg    = $("#bg"), 
      aspectRatio  = $bg.width()/$bg.height(); 

     function resizeBg() { 

       if ((theWindow.width()/theWindow.height()) < aspectRatio) { 
        $bg 
         .removeClass() 
         .addClass('bgheight'); 
       } else { 
        $bg 
         .removeClass() 
         .addClass('bgwidth'); 
       } 

     } 

     theWindow.resize(resizeBg).trigger("resize"); 

});

調整的代碼，而不是「$（窗口）」是你的容器。

來源

2013-04-22 16:52:47 Plummer

IE7/8縮放背景圖像其容器寬度的100％

回答

相關問題