使用 Adobe 为其入门 JQuery Mobile 站点示例提供的模板进行离线练习。
http://www.adobe.com/devnet/dreamweaver/articles/dw-template-jqmobile.html
但我发现我似乎不能建立超过 4 页。我用内容制作了第五页,但出现了黑屏。我需要做什么来解决这个问题?
使用 Adobe 为其入门 JQuery Mobile 站点示例提供的模板进行离线练习。
http://www.adobe.com/devnet/dreamweaver/articles/dw-template-jqmobile.html
但我发现我似乎不能建立超过 4 页。我用内容制作了第五页,但出现了黑屏。我需要做什么来解决这个问题?
您的 HTML 中可能有 ab 错误。
这是一个使用额外第五页构建的 adobe 示例。将其复制到单个文件中并进行测试,所有 js/css 文件都是硬编码的,因此您无需担心:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>`enter code here`
<link href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" rel="stylesheet" type="text/css" />
<script src="http://www.maja-klajic.info/js/jquery-1.8.2.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js" type="text/javascript"></script>
</head>
<body>
<div data-role="page" id="page">
<!-- The 'logo' DIV below was added to the default markup -->
<div class="logo"></div>
<div data-role="header" class="heading">
<h1>Your Organization</h1>
</div>
<div data-role="content">
<ul data-role="listview" class="mainmenu">
<li><a href="#page2">Who We Are</a></li>
<li><a href="#page3">What We Do</a></li>
<li><a href="#page4">About Us</a></li>
<li><a href="#page5">Fift Page</a></li>
</ul>
</div>
<div data-role="footer">
<h4>©2011 • Your Organization Name</h4>
</div>
</div>
<div data-role="page" id="page2">
<div data-role="header">
<h1>Who We Are</h1>
</div>
<div data-role="content">
<p>Nunc auctor bibendum eros. Maecenas porta accumsan mauris. Etiam enim enim, elementum sed, bibendum quis, rhoncus non, metus. Fusce neque dolor, adipiscing sed, consectetuer et, lacinia sit amet, quam. Suspendisse wisi quam, consectetuer in, blandit sed, suscipit eu, eros. Etiam ligula enim, tempor ut, blandit nec, mollis eu, lectus. Nam cursus. Vivamus iaculis. Aenean risus purus, pharetra in, blandit quis, gravida a, turpis. Donec nisl. Aenean eget mi. Fusce mattis est id diam. Phasellus faucibus interdum sapien. Duis quis nunc. Sed enim.</p>
</div>
<div data-role="footer">
<h4>©2011 • Your Organization Name</h4>
</div>
</div>
<div data-role="page" id="page3">
<div data-role="header">
<h1>What We Do</h1>
</div>
<div data-role="content">
<h2>Maecenas porta accumsan mauris</h2>
<p>Nunc auctor bibendum eros. Maecenas porta accumsan mauris. Etiam enim enim, elementum sed, bibendum quis, rhoncus non, metus. Fusce neque dolor, adipiscing sed, consectetuer et, lacinia sit amet, quam. Suspendisse wisi quam</p>
<figure>
<img src="images/photo.jpg" alt="photo" width="120" />
<figcaption>Duis a eros lit ora tor quent per conu bia nos tra per.</figcaption>
</figure>
<p>Consectetuer in, blandit sed, suscipit eu, eros. Etiam ligula enim, tempor ut, blandit nec, mollis eu, lectus. Nam cursus. Vivamus iaculis. Aenean risus purus, pharetra in, blandit quis, gravida a, turpis. Donec nisl. Aenean eget mi. Fusce mattis est id diam. Phasellus faucibus interdum sapien. Duis quis nunc. Sed enim.</p>
<p>Nunc auctor bibendum eros. Maecenas porta accumsan mauris. Etiam enim enim, elementum sed, bibendum quis, rhoncus non, metus. Fusce neque dolor, adipiscing sed, consectetuer et, lacinia sit amet, quam. Suspendisse wisi quam, consectetuer in, blandit sed, suscipit eu, eros. Etiam ligula enim, tempor ut, blandit nec, mollis eu, lectus. Nam cursus. Vivamus iaculis. Aenean risus purus, pharetra in, blandit quis, gravida a, turpis. Donec nisl. Aenean eget mi. Fusce mattis est id diam. Phasellus faucibus interdum sapien. Duis quis nunc. Sed enim.</p>
</div>
<div data-role="footer">
<h4>©2011 • Your Organization Name</h4>
</div>
</div>
<div data-role="page" id="page4">
<div data-role="header">
<h1>About Us</h1>
</div>
<div data-role="content">
<p>Nunc auctor bibendum eros. Maecenas porta accumsan mauris. Etiam enim enim, elementum sed, bibendum quis, rhoncus non, metus. Fusce neque dolor, adipiscing sed, consectetuer et, lacinia sit amet, quam. Suspendisse wisi quam, consectetuer in, blandit sed, suscipit eu, eros. Etiam ligula enim, tempor ut, blandit nec, mollis eu, lectus. Nam cursus. Vivamus iaculis. Aenean risus purus, pharetra in, blandit quis, gravida a, turpis. Donec nisl. Aenean eget mi. Fusce mattis est id diam. Phasellus faucibus interdum sapien. Duis quis nunc. Sed enim.</p>
</div>
<div data-role="footer">
<h4>©2011 • Your Organization Name</h4>
</div>
</div>
<div data-role="page" id="page5">
<div data-role="header">
<h1>This is fifth page</h1>
</div>
<div data-role="content">
<p>This is fifth page</p>
</div>
<div data-role="footer">
<h4>©2011 • Your Organization Name</h4>
</div>
</div>
</body>
</html>