Question

我正在尝试使用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
    });

});

这是正在进行的网络应用... http://mobile.graphitedesign.com/#menu

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

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

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

任何指示都会感激不尽！

谢谢！

Answer 1

你可以试试吗？ “最小高度：25％;” ？

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

1 个答案: