我的问题是JQM
。我目前正在开发一个移动应用程序,其中包括一个固定的页眉和页脚。
在Safari
和Chrome (Mac)
上一切正常,但是当我在iPhone
或iPad Safari
上查看应用时,固定的页眉和页脚在第一个时不会保持在最顶层时刻。滚动和停止后,页眉和页脚保持固定,正如它们应该的那样。
我的来源:
<!DOCTYPE html>
<html>
<head>
<script src="phonegap.js"></script>
<title>Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="stylesheet" href="jquery/jquery.mobile-1.2.0.min.css" />
<link rel="stylesheet" href="jquery/jquery.mobile.theme-1.2.0.css" />
<script src="jquery/jquery-1.8.2.min.js"></script>
<script>
$(document).bind("mobileinit", function() {
$.mobile.page.prototype.options.addBackBtn = true;
});
</script>
<script src="jquery/jquery.mobile-1.2.0.min.js"></script>
</head>
<body>
<div data-role="page" id="master">
<div data-role="header" data-position="fixed" class="header-custom">
<img src="images/logo.png" style="height: 44px;"> <a href="index.html" data-icon="refresh" id="refreshButton" class="ui-btn-right" style="fmargin-top: 4px;" data-iconpos="notext">Aktualisieren</a>
</div>
<!-- /header -->
<div data-role="content">
<ul data-role="listview" id="rssListView"></ul>
</div>
<!-- /content -->
</div>
<!-- /page -->
</body>
</html>
自定义标题类:
/* Custom navbar */
.header-custom {
height: 44px;
background-image: url(images/header.png);
background-size: cover;
}
答案 0 :(得分:1)
解决了它。如果我在我的标题中添加<h1></h1>
元素,它可以正常工作,但我不确定为什么JQM会这样做。这是JQM中的错误吗?