我在PhoneGap上构建一个移动应用程序,我必须在每个页面上使用相同的面板,但我不知道在哪里放置面板代码。在互联网上我发现面板代码必须在标题之前,在外面使用data-role="page"
的div但这不起作用..
DEMO:http://jsfiddle.net/zC7Lq/2/
html结构:
<div data-role="page" id="page1" data-theme="c">
<!-- Header -->
<div data-role="header" id="wrap-header">
<img src="img/logo.png" class="logo"/>
<a href="#" class="ui-btn-right button" id="btn-menu">Menu</a>
</div>
<!-- /header -->
<!-- Content -->
<div data-role="content" id="content">
<h3>Content</h3>
<p>
page1
</p>
</div>
<!-- /content -->
<!-- footer -->
<div data-role="footer">
<h4>© 2013 Your Name</h4>
</div>
<!-- /footer -->
</div>
小组结构:
<div data-role="panel" id="myPanel" data-display="overlay" data-position="right">
<h2>Panel Header..</h2>
<p>Some text in the panel..</p>
<a href="#pageone" data-rel="close" class="ui-btn ui-btn-inline">Close Panel</a>
</div>
答案 0 :(得分:0)
<div data-role="page" id="home" data-theme='a'>
<div data-role="panel" id="mypanel" data-theme='e'>
.......................
</div>
<div data-role="header">
..................
在data-role="page"
header
之后