## 个人中心
~~~
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
<title>我的</title>
<link rel="stylesheet" type="text/css" href="../../css/aui.css" />
<style>
.my-header {
background-color: #00CCFF;
position: relative;
margin-bottom: 0;
}
.my-info {
position: relative;
padding: 20px 0;
width: 100%;
bottom: 0;
text-align: center;
vertical-align: center;
}
.my-info img {
width: 80px;
height: 80px;
border-radius: 50%;
}
.my-info p.nickname {
margin-top: 5px;
color: #ffffff;
font-size: 18px;
}
.aui-list-view-cell {
line-height: 26px;
}
.amount-info {
background-color: #ffffff;
overflow: hidden;
}
.amount-info p {
font-size: 0.75em;
}
.amount-info p strong {
font-size: 18px;
}
.aui-list-view-cell {
line-height: 26px;
}
.amount-info .aui-col-xs-6 {
padding: 15px 0;
position: relative;
height: 80px;
}
.amount-info .aui-col-xs-6:after {
border-left: 1px solid #ddd;
display: block;
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-transform-origin: 0 0;
-webkit-transform: scale(1);
pointer-events: none;
}
.amount-info .aui-col-xs-6:first-child:after {
border: none;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {
.amount-info .aui-col-xs-6:after {
right: -100%;
bottom: -100%;
-webkit-transform: scale(0.5);
}
}
</style>
</head>
<body>
<div class="aui-content my-header">
<div class="my-info">
<img src="../../image/demo.png" />
<p class="nickname">
测试员
</p>
</div>
</div>
<div class="aui-content aui-text-center amount-info">
<div class="aui-col-xs-6">
<p class="aui-text-danger">
<strong id="amount">88.00</strong>元
</p>
<p>
我的资金
</p>
</div>
<div class="aui-col-xs-6">
<p class="aui-text-warning">
<strong>999</strong>个
</p>
<p>
我的积分
</p>
</div>
</div>
<div class="aui-content">
<ul class="aui-grid-nine">
<li class="aui-col-xs-4 aui-text-center" tapmode onclick="fnOpenWin('myapp_list_win')">
<span class="aui-iconfont aui-icon-discover aui-text-primary"></span>
<p>
我的仪器
</p>
</li>
<li class="aui-col-xs-4 aui-text-center" tapmode onclick="fnOpenWin('myorder_win')">
<span class="aui-iconfont aui-icon-shake aui-text-danger"></span>
<p>
我的订单
</p>
</li>
<li class="aui-col-xs-4 aui-text-center" tapmode onclick="fnOpenWin('myaccount_win')">
<span class="aui-iconfont aui-icon-pay aui-text-warning"></span>
<p>
我的钱包
</p>
</li>
<li class="aui-col-xs-4 aui-text-center" tapmode onclick="fnOpenWin('mycollect_win')">
<span class="aui-iconfont aui-icon-tagfill aui-text-pink"></span>
<p>
我的收藏
</p>
</li>
<li class="aui-col-xs-4 aui-text-center" tapmode onclick="fnOpenWin('myalter_win')">
<span class="aui-iconfont aui-icon-repair aui-text-dark"></span>
<p>
资料修改
</p>
</li>
<li class="aui-col-xs-4 aui-text-center" tapmode onclick="fnOpenWin('mycomplain_win')">
<span class="aui-iconfont aui-icon-service aui-text-info"></span>
<p>
我的客服
</p>
</li>
</ul>
</div>
</body>
</html>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript">
apiready = function() {
api.parseTapmode();
// 优化点击事件
}
function fnOpenWin(type){
api.openWin({
name: type,
url: type+'.html'
});
}
</script>
~~~
# 效果如下：
- APP模块
- 欢迎页
- 头部模块
- 底部模块
- 图文列表
- 商品展示
- 文字列表
- 内容页一
- 评论页
- N宫格
- 获得上一级的栏目名称
- 搜索模块
- 图标
- 幻灯模块
- 消息页
- 个人中心
- 个人中心—我的收藏
- 个人中心—资料修改
- 个人中心—我的钱包（账户）
- 咨询页面
- APP模板
- 注册 页面一
- 注册 页面二
- 登录 页面一
- 登录 页面二
- 忘记密码 页面一
- 会员中心 首页一
- 会员中心 首页二
- 会员中心 首页三
- 会员中心 资料修改
- 申请审核步骤
- 商品订单一
- 游戏页面
- 新闻列表页
- 图文列表页
- 商品列表页
- 商品详情页
- 聊天
- 消息列表
- 聊天界面
- 发布需求
- 前端框架
- CSS Framework
- trim 字符处理
- dom 选择器
- 样式
- evt 事件
- 选择元素
- 属性
- 文本
- 位置
- json
- 设置
- 提示
- AJAX
- storage 本地存储
- API对象
- 常用函数
- openWin()
- closeWin()
- apiready
- fixStatusBar(header)
- api.setRefreshHeaderInfo
- api.openFrame
- randomSwitchBtn(index,name)
- APP常用图片
- asd