<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<link rel="stylesheet" href="js/jquery.mobile-1.4.5.min.css" />
<script src="js/jquery.js"></script>
<script src="js/jquery.mobile-1.4.5.min.js"></script>
<title>my fist app</title>
<script type="text/javascript">
document.addEventListener('plusready', function(){
//console.log("所有plus api都应该在此事件发生后调用,否则会出现plus is undefined。"
});
</script>
<style>
img {max-width: 100%;}
</style>
</head>
<body>
<div data-role="page" id="pageone">
<div data-role="header">
<h1>My First Mobile site</h1>
</div>
<div data-role="content" align="center">
<p>Welcome to my first mobile site.</p>
<p>Try me on all of your mobile devices! You can use any
<strong>valid HTML</strong>on this page</p>
<img src="img/inner_100.png" alt="Golden Gate Bridge">
<a href="#pagetwo" data-role="button">Go to Page 2</a>
<p style="text-align:center;">Powered by jQuery Mobile </p>
</div>
<div data-role="footer">
<h3>a footer!</h3>
</div>
</div>
<div id="pagetwo" data-role="content">
<p>You've made it to page 2!</p>
<p>Isn't that awesome?</p>
<a href="#pageone" data-role="button">Go Back to Page1</a>
<p style="text-align:center;">Powered by jQuery Mobile</p>
</div>
<div data-role="footer">
<h3>a footer two!</h3>
</div>
</body>
</html>
显示结果:
pagetwo:
代码地址:
https://download.csdn.net/download/zang141588761/11170223