jQueryモバイルを使用してオーバーフローまたはスクロールなしでコンテンツをフルスクリーンに設定する

Question

jQuery Mobileを使用してWebアプリケーションを作成しようとしています。私は画面全体を満たす4つのボタンで構成されるナビゲーションページを作りたいと思っています。

私は次のjQueryを使用して画面の高さを返し、4で割って各ボタンに適用します。私はあなたがiPhone上でこれを表示した場合 http://mobile.graphitedesign.com/#menu

あなたはで示す小さな灰色の背景があることがわかります...ここで

var winHeight = window.innerHeight; 
var buttHeight = winHeight/4; 
var winWidth = $(window).width(); 

$('.fullWidthButton').css({ 
    height: buttHeight, 
    width: winWidth 
}); 

$('.ui-mobile-viewport').css({ 
    height: winHeight, 
    width: winWidth 
}); 
console.log(winHeight); 


$('#menu').bind("orientationchange", function() { 
    var winHeight = $(window).height(); 
    var buttHeight = winHeight/4; 
    var winWidth = $(window).width(); 

    $('.fullWidthButton').css({ 
     height: buttHeight, 
     width: winWidth 
    }); 

    $('.ui-mobile-viewport').css({ 
     height: winHeight, 
     width: winWidth 
    }); 

}); 

が進行中のWebアプリケーションです...姿勢変化にこれを繰り返しますあなたがスクロールしているときに画面の下に表示されます。これは、世界の終わりではありませんが、理想的には、ユーザーがこれを見るのを止めたいと思います。

画面を回転させると、jQueryはボタ​​ンの高さを調整していますが、巨大な灰色の背景があります。私はこれを削除するためにすべてを試しましたが、何も動作していません。

理想的には、スクロールを完全に無効にしたいのですが、アドレスバーが失われます。

いずれのポインタもありがとうございます。

ありがとうございます！

Answer 1

「最小高さ：25％; ？