0 
<script type="text/javascript">  
    $(document).ready(function(e){  
       var dheight=$(document).innerHeight();  
       $(".background").css({  
          "height": dheight,  
          "overflow":"hidden"  
       });  
    });  
</script>

<section id="box">
    <section class="heading">
        <div class="head">SiteName</div>
    </section>
    <!--heading-->
    <div class="background">
        <img src="images/hdimage.jpg" width="100%" />
    </div>
    <!--background-->
</section>
<!--box-->

問題は、Internet Explorer（IE 10でも）が、設定した場合<div class="background">でも、画像のアスペクトの高さを取得することです。heightmax-heightoverflow: hidden

Google Chrome、Firefoxでは問題ありません。IEで調べたところ、IEは画像の高さを含むインラインスタイルをに追加していることがわかりました<div>。この問題を解決するにはどうすればよいですか？

4

2 に答える 2

0

あなたのコードが完全であり、すべてのインスタンスとブラウザで機能することにはほど遠い場合、フルスクリーンの背景を達成しようとしていると思います。

imgに終了タグがないため、コードが機能していない可能性があります/>

この記事にある次のコードをご覧になることをお勧めします

.background{

         background: url(images/bg.jpg) no-repeat center center fixed; 
          -webkit-background-size: cover;
          -moz-background-size: cover;
          -o-background-size: cover;
          background-size: cover;
          filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
          -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";

}
于 2013-03-20T10:46:28.507 に答える
0

私の意見では、これらの線は予測できません

$(document).ready(function(e){  
       var dheight=$(document).innerHeight();

高さがまだ利用できないために画像を処理する場合は、画像が読み込まれるのを待つ必要があります。

$(window).on('load',fumction(){
   var dheight=$(document).innerHeight();
   ...
})

より良いオプションです

于 2013-03-20T10:49:11.447 に答える