|
|
刚学jqm不久，写了个小demo，但不知为什么两个页面间的跳转很慢，求指导，求优化
下面是连个页面的代码
========chanpindingzhi.html================
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>产品定制</title>
<link rel="stylesheet" href="jquery.mobile-1.3.2.css">
<link rel="stylesheet" href="jqm-demos.css">
<link rel="shortcut icon" href="favicon.ico">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700">
<link rel="stylesheet" href="grid-listview.css">
<script src="jquery1.10.2.js"></script>
<script src="index.js"></script>
<script src="jquery.mobile-1.3.2.js"></script>
</head>
<body>
<div data-role="page" data-theme="a" id="demo-page" class="my-page">
<div data-role="header">
<h1>产品定制</h1>
<a href="#" data-shadow="false" data-iconshadow="false" data-icon="arrow-l" data-iconpos="notext" data-rel="back" data-transition="slide">Back</a>
</div><!-- /header -->
<div data-role="content">
<ul data-role="listview" data-inset="true" data-filter="true">
<li><a href="tianjia.html" data-transition="slide">
<img src="apple.png">
<h2>电器音响娱乐</h2>
<p>电器 影响 游戏机</p>
<p class="ui-li-aside">3</p>
</a></li>
<li><a href="#">
<img src="apple.png">
<h2>妇婴儿</h2>
<p>儿童用具 孕妇用品 婴儿奶粉 婴儿用品</p>
<p class="ui-li-aside">4</p>
</a></li>
<li><a href="#">
<img src="apple.png">
<h2>工业设备</h2>
<p>Nokia rolls out WP 7.8 to Lumia 800</p>
<p class="ui-li-aside">12</p>
</a></li>
</ul>
</div><!-- /content -->
</div><!-- /page -->
</body>
</html>
======tianjia.html=========
<!DOCTYPE html>
<html>
<head>
<title>添加产品</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet"
href="jquery.mobile-1.3.2.css" />
<script src="jquery1.10.2.js"></script>
<script
src="jquery.mobile-1.3.2.js"></script>
</head>
<body>
<div data-role="page" data-theme="a">
<div data-role="header">
<a href="chanpindingzhi.html" data-shadow="false" data-iconshadow="false" data-icon="arrow-l" data-iconpos="notext">Back</a>
<h1>添加产品</h1>
<a href="chanpindingzhi.html" data-shadow="false" data-iconshadow="false" data-icon="check" data-iconpos="notext">Back</a>
</div><!-- /header -->
<div data-role="content">
<ul data-role="listview" data-split-icon="plus" data-theme="a" data-split-theme="b" data-inset="true" data-filter="true">
<li><a href="#">
<h2>电器</h2>
</a><a href="#purchase" data-rel="popup" data-position-to="window" data-transition="pop">确认添加？</a>
</li>
<li><a href="#">
<h2>音像</h2>
</a><a href="#purchase" data-theme="e" data-rel="popup" data-position-to="window" data-transition="pop">确认添加？</a>
</li>
</ul>
<div data-role="popup" id="purchase" data-theme="d" data-overlay-theme="b" class="ui-content" style="max-width:340px; padding-bottom:2em;">
<h3>确认添加？</h3>
<a href="index.html" data-role="button" data-rel="back" data-theme="b" data-icon="check" data-inline="true" data-mini="true">Sure</a>
<a href="index.html" data-role="button" data-rel="back" data-inline="true" data-mini="true">Cancel</a>
</div>
</div><!-- /content -->
</div><!-- /page -->
</body>
</html>
|
|
/1 
发表于 2013-10-28 22:38:01
收藏
转播
淘帖
发表于 2013-10-29 09:15:45
