1

phonegap と jquery mobile を使用しています。私のコードは以下のとおりです

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=screen.width; initial-scale=1" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
  <link rel="stylesheet" href="jquery.mobile/jquery.mobile-1.1.0.css" type="text/css">
  <script type="text/javascript" src="jquery.mobile/jquery-1.7.2.min"></script>
  <script type="text/javascript" src="jquery.mobile/jquery.mobile-1.1.0.js"></script>
  <script type="text/javascript" src="jquery.mobile/phonegap-1.4.1.js"></script>
<script type="text/javascript" charset="utf-8" src="main.js"></script>
 <!-- CDN Respositories: For production, replace lines above with these        uncommented       minified versions -->
<!-- <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />-->
<!-- <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>-->
<!-- <script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>-->
</head>
<body>
<div id="page" data-role="page" data-theme="b">
<div class="ui-btn-corner-top" data-role="header" data-theme="b" >
<h1>Login</h1>
</div>
<div data-role="content">
<div>
<h4>
  <label for="userName" style="text-align:center">User Name</label>
</h4>
<input name="userName" type="text" id="userName" value="" data-theme="b"  />
</div>
<div>
<h4>
  <label for="passwordinput" style="text-align:center">Password</label>
</h4>
<input name="passwordinput" type="password" id="passwordinput" value="" data-theme="b"  />
</div>
</div>
<div class="ui-btn-corner-bottom" data-role="footer" data-theme="b">
<h4>Auth Demo</h4>
</div>
</div>
</body>
</html>

しかし、要素は画面全体に表示されていません...画面の途中で終わります。画面全体の高さと幅を取得する場合はどうすればよいですか?

4

2 に答える 2

0

あなたはこれをやってみることができるかもしれません：

<style type="text/css">
  html { height: 100% }
  body { height: 100%; margin: 0; padding: 0 }
</style>

<body> 
<div id="page" data-role="page" data-theme="b" style="width:100%; height:100%">
...
</div>
</body>
于 2013-02-16T19:47:42.100 に答える
0

フッター div に data-position="fixed" 属性を追加します。

詳細はこちら: http://jquerymobile.com/demos/1.2.0/docs/toolbars/bars-fixed.html

于 2013-02-16T20:14:49.443 に答える