使用jQuery mobile设置内容全屏，无溢出或滚动

我正在尝试使用jQuery Mobile创建一个web应用程序。我想做一个导航页面，由4个按钮组成，填充整个屏幕

我使用以下jQuery返回屏幕高度，将其除以4，然后将其应用于每个按钮。我重复这个关于方向改变

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应用程序。。。

如果你在iPhone上查看，你会注意到当你滚动时，底部会显示微小的灰色背景-不是世界末日，但理想情况下，我想阻止用户看到这一点，让菜单一直充满屏幕

如果你旋转屏幕，jQuery正在做它的工作，并调整按钮的高度，但是现在有一个巨大的灰色背景。我已经尝试了所有方法来移除这个，但是没有任何效果

理想情况下，我想完全禁用滚动，但随后我会丢失地址栏

任何指点者都将不胜感激

谢谢

你能试试吗 “最小高度：25%；”

---

？

在发布此问题之前，我应该再尝试5分钟。。。最小高度：300px设置在屏幕上。我覆盖了它，它解决了问题。不过，任何关于改进这一点的建议都很好。还在我的闲暇时光！