Question

我使用jQuery mobile制作了一个应用程序，但现在我遇到了一个很大的问题。我不能让底部菜单栏显示在iPhone的页面底部。它适用于诺基亚c6和桌面浏览器。我使用了position: absolute和bottom: 0。当我删除这些属性时，它会变得更紧凑。见图片。

Answer 1

如果要让它显示在屏幕底部，则必须检查包含页面的div是否至少与屏幕一样长。类似的东西：

$('div[data-role="page"]').live('pageshow orientationchange', function () {
    var window_height = $(window).height();
    if ($(this).find('div[data-role="content"]').height() < window_height) {
        //window height minus the height of the header bar
        var th = (window_height - $(this).find('div[data-role="header"]')).height());

        //set page to height of window
        $(this).height(window_height);
        $(this).find('div[data-role="content"]').height(th);
    } else {
        //set page to height of window to auto so page does not cut-off at screen height
        $(this).height('auto');
        $(this).find('div[data-role="content"]').height('auto');
    }
});

iPhone上的jQuery移动页面底部的菜单栏定位问题

1 个答案: