HTML/CSS：ドキュメントの高さに等しい高さのIMG（ウィンドウではない）

Question

どのようにしてその効果を達成できますか？

CSSコード：のような完全な水平および垂直のtry何かのために

Answer 1

：これが動作しないという理由がある場合

background-image: url(image.jpg); 
background-repeat:no-repeat; 
background-position:center center; 
background-attachment:fixed; 
-o-background-size: 100% 100%, auto; 
-moz-background-size: 100% 100%, auto; 
-webkit-background-size: 100% 100%, auto; 
background-size: 100% 100%, auto; 

またはより良いhttp://jsfiddle.net/

Answer 2

であなたのコードを投稿

 
    #theImage { 
     height: 100%; 
    } 

次にjQueryを使用するとs：

 
    var docHeight = $(document).height(); 
    $('#theImage').css('height', docHeight); 

普通の古いJavaScriptでこれを行う方法はわかりませんが、これはjQueryの例です。

Answer 3

JavaScriptを使用して処理する必要があるようなものです。個人的に私はの効果にjQueryと何かを使用します。

$(document).ready(function() { //Runs at page load 
    $(".ID_OF_IMAGE").each(function() { //calls the anon function for the id tag specified 
     /*sets the height to the max of three methods of height measurement 
     diff browsers detect doc height differently.*/ 
     this.height = Math.max(
      //gets the larger between doc height and body height 
      Math.max(document.body.clientHeight, document.documentElement.clientHeight), 
      Math.max(document.body.offsetHeight, document.documentElement.offsetHeight), 
      Math.max(document.body.scrollHeight, document.documentElement.scrollHeight)) 
    }); 
}); 

代わりに、あなたはdiv要素や身体の背景として画像を設定し、繰り返し-yのCSSプロパティを使用することができます。

body { //also works for div's 
    background-image:url('image.jpg'); 
    background-repeat:repeat-y; 
} 

-SB

Answer 4

あなたの問題が最も可能性が高い子の高さは、htmlタグに関連しているので、bodyタグは、静的に配置されているという事実に由来します。これを追加

試してみてください。

body{ 
    position:relative; 
} 

それは身体の子どもたちは、文書のサイズではなく、ブラウザのビューポートを使用して行います。 http://jsfiddle.net/cP9hu/