わかりましたので、ページが正しく表示されるように、プロトタイプを使用してページの読み込み時にコンテナの最小の高さを動的に設定しようとしています。ヘッダーとフッターの高さは 345 ピクセルなので、メイン コンテナーの div の最小の高さを、ページの読み込み時にウィンドウの内側の高さからこれらの寸法を引いた値に設定しようとしています。これが私がこれまでに試したことです:
document.observe("dom:loaded", function() {
var minHeight = window.innerHeight;
minHeight -= 345;
$('main-container').style.minHeight = minHeight;
});
と:
document.observe("dom:loaded", function() {
var minHeight = window.innerHeight;
minHeight -= 345;
$('main-container').setStyle({
minHeight : minHeight
});
});
document.observe 関数のアラートを介してページの読み込み時にスクリプトが起動することは知っていますが、高さを追加したり、エラーをスローしたりしていません。何か案は?
編集
答えてくれた@Andrewのおかげで、ユーザーがサイズを変更して共有したいと思ったときのために、このコードも追加しました。
Event.observe(window, 'resize', function() {
var minHeight = window.innerHeight;
minHeight -= 345;
$('main-container').setStyle({
'min-height' : minHeight+'px'
});
});