在Jquery Mobile / Phonegap应用程序底部的Android-空白空间

时间:2013-01-04 19:45:00

标签: android cordova jquery-mobile

我正在开发一个用于android的jquery mobile / phonegap的应用程序。问题是屏幕底部的空白区域。屏幕截图将有助于它更好。我在互联网上搜索但找不到 合适的答案。

截图: http://img248.imageshack.us/img248/5922/jquerymobile.png

代码:

<!DOCTYPE html> 
<html> 
    <head> 
        <title>Slider Stop</title> 
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <script type="text/javascript" charset="utf-8" src="js/cordova-1.8.0.js"></script>
        <link rel="stylesheet" href="js/jquery.mobile-1.2.0.min.css" />
        <script type="text/javascript" src="js/jquery-1.81.js"></script>
        <script type="text/javascript" src="js/jquery.mobile-1.2.0.min.js"></script>

    </head> 
    <body>


        <div data-role="page" id="home">
        <div data-role="header">
            <h1>App</h1>
        </div>
            <div data-role="content">
                <p>
                <ul data-role="listview" data-inset="true" data-theme="c">
                    <li id="listitem">Swipe Right to view Page 1</li>
                </ul>
                </p>
            </div>
                 <div data-role="footer">
        <h4>Footer content</h4>
    </div>
        </div>

    </body>
</html>

2 个答案:

答案 0 :(得分:2)

尝试将'footer'div发送到:#/ p>

<div data-role="footer" data-position="fixed">

答案 1 :(得分:0)

我遇到了同样的问题,但是我正在调整的网络应用程序是非常有活力的,并且没有“#footer”#39; div,我无法使用cleondz提供的解决方案。

我发现在我的情况下,我必须使用解决方法,如果滚动并非真的必要,则只需禁用滚动。

我使用this link来实现它。

function isDraggablePage(e)
{
    if($(‘.ui-page-active’).attr(‘draggable’)==”true”)
    {
        return true;
    }
    return false;
}


function setDraggableProperty(e)
{
    if (!isDraggablePage(e))
    {
        e.preventDefault();
    }
}

window.addEventListener(‘touchmove’, setDraggableProperty(e), true);

几年前我没有使用过Javascript - 我现在是Android开发者 - 所以我不确定代码是否合适,但它确实有效。