Jquery Phonegap/jQM应用程序首次运行时包含非常小的文本和控件_Jquery_Android_Jquery Mobile_Cordova

Jquery Phonegap/jQM应用程序首次运行时包含非常小的文本和控件

jquery android jquery-mobile cordova

Jquery Phonegap/jQM应用程序首次运行时包含非常小的文本和控件,jquery,android,jquery-mobile,cordova,Jquery,Android,Jquery Mobile,Cordova,下面是三张显示问题的图片。稍后我会详细介绍正如您所看到的，一开始是由于某些原因导致页面呈现不正确。我不知道会是什么。我已经重新排列了脚本和样式。无论我做什么，第一次运行应用程序时，所有内容的大小都非常小，唯一的纠正方法是点击搜索栏更糟糕的是，如果你在浏览器、FireFox或Chrome中查看它，在将其部署到设备之前，它会完美呈现。直到它出现在我的设备上，它才会在第一次使用时收缩。这就是关键所在，如果我按下home（主页）按钮并返回到我的应用程序，就没事了。如果我强制停止并启动我的应用程

下面是三张显示问题的图片。稍后我会详细介绍

正如您所看到的，一开始是由于某些原因导致页面呈现不正确。我不知道会是什么。我已经重新排列了脚本和样式。无论我做什么，第一次运行应用程序时，所有内容的大小都非常小，唯一的纠正方法是点击搜索栏

更糟糕的是，如果你在浏览器、FireFox或Chrome中查看它，在将其部署到设备之前，它会完美呈现。直到它出现在我的设备上，它才会在第一次使用时收缩。这就是关键所在，如果我按下home（主页）按钮并返回到我的应用程序，就没事了。如果我强制停止并启动我的应用程序，它会再次变小

<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="Styles/jquery.mobile-1.0rc1.css" />
    <script type="text/javascript" charset="utf-8" src="Scripts/phonegap-1.1.0.js"></script>
    <script type="text/javascript" src="Scripts/jquery-1.6.4.min.js"></script>
    <script type="text/javascript" src="Scripts/jquery.mobile-1.0rc1.min.js"></script>
    <script type="text/javascript" src="Scripts/common.js"></script>
</head>
<body>
    <div data-role="page" id="home" data-title="Search">
        <div data-position="fixed" data-role="header">
            <h1>
                Search
            </h1>
        </div>
        <div data-role="content">
            <form action="#" method="POST">
                <input id="search" type="search" placeholder="Search" />

                <button type="submit" data-inline="true" data-icon="search" id="searchWikiMedia">
                    Search</button>
            </form>
            <div id="refineSearch">
                <ul data-role="listview">
                </ul>
                <span id="error"></span>
            </div>
        </div>
        <div data-position="fixed" data-role="footer">
        </div>
    </div>
    <div data-role="page" id="result" data-title="Results">
        <div data-position="fixed" data-role="header">
            <a href="#home" data-transition="slide" data-direction="reverse">Search</a>
            <h1>
            </h1>
        </div>
        <div data-role="content">
        </div>
        <div data-role="footer">
            <h4>
            </h4>
        </div>
    </div>
</body>
</html>


搜寻
搜寻

将此添加到您的

标签之间：

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
or simply
<meta name="viewport" content="initial-scale=1, maximum-scale=1">


或者干脆

进一步阅读：

首先，您应该确保您有一个Doctype并通过验证器运行html谢谢！我要是早点问就好了，因为这样可以节省我大约3个小时的随机尝试时间。我当然也会阅读这个链接。