ウェブサイト上で動的背景イメージを作成する方法は？

Question

依存関係を使用する必要があるかどうかはわかりませんが、RailsでRailsを使ってJqueryを使用しています。しかし、私は自分の背景に使用したい3つのイメージがあります。

トップイメージ、ミドルイメージ、ボトムイメージです。トップとボトムの画像を静的にしたいが、そのページに含まれるコンテンツの量に応じて中間の画像タイルを作成したい。誰がどのようにこれを行うだろう任意のアイデアを誰ですか？私は運がないとしばらく見回してきました。

.background-top { 
    background-image: image-url('background/background_top.png'); 
    background-repeat: no-repeat; 
    background-size: 100%; 
    background-position: top; 
} 
.background-mid { 
    background-image: image-url('background/background_mid.png'); 
    background-repeat: no-repeat; 
    background-size: 100%; 
    background-position: center; 
} 
.background-bot { 
    background-image: image-url('background/background_bot.png'); 
    background-repeat: no-repeat; 
    background-size: 100%; 
    background-position: bottom; 
} 

Answer 1

var body = document.body; 
html = document.documentElement; 
var height = Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight); 

あなたのページの高さを取得するには、このコードを使用してください。高さがその特定のサイズより大きい場合、中間イメージの読み込み時に条件を追加します。