1

请耐心等待，因为我是初学者：D

我尝试将 jQuery Mobile 框架添加到我的 Worklight 项目中。我遵循了这个链接说明（所以，我手动添加了 jQuery Mobile，就像在链接中一样）。

然后，我尝试运行此代码：

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="UTF-8">
    <title>JakartaWikiMall</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
    <link rel="shortcut icon" href="images/favicon.png">
    <link rel="apple-touch-icon" href="images/apple-touch-icon.png">

    <link rel="stylesheet" href="css/jquery.mobile-1.3.1.min.css">
    <link rel="stylesheet" href="css/JakartaWikiMall.css">
    <script>window.$ = window.jQuery = WLJQ;</script>
</head>
<body onload="WL.Client.init({})" id="content" style="display: none;">
    <!--application UI goes here-->
    <div data-role="page">
        <div data-role="header">
            <h1>Page Title</h1>
        </div>

        <div data-role="content">
            <p>Page content goes here</p>
        </div>

        <div data-role="footer">
            <h4>Page Footer</h4>
        </div>
    </div>

    <script src="js/jquery-1.9.1.js"></script>
    <script src="js/jquery.mobile-1.3.1.min.js"></script>
    <script src="js/initOptions.js"></script>
    <script src="js/JakartaWikiMall.js"></script>
    <script src="js/messages.js"></script>
</body>
</html>

这就是我从 Android Simulator 得到的：

在此处输入图像描述

从浏览器模拟器：

在此处输入图像描述

可以看到，footer 不在脚下，在 Android Simulator 中内容变得非常大。（但是在我上面提供的链接中事情是正确的，所以一定有问题）

我应该怎么办？

任何帮助表示赞赏，如果您需要其他帮助，请告诉我。非常感谢 :D

4

1 回答 1

4

添加data-position="fixed"到您的页脚。

演示http://jsfiddle.net/yeyene/Rdfxs/

<div data-role="footer" data-position="fixed">
    <h1>Fixed Footer!</h1>
</div>

更多 JQM 演示和文档在这里http://view.jquerymobile.com/1.3.1/dist/demos/widgets/fixed-toolbars/

于 2013-06-19T04:58:23.850 回答