<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet" href="./css/mui.min.css">
<style>
html,
body {
background-color: #efeff4;
}
.mui-views,
.mui-view,
.mui-pages,
.mui-page,
.mui-page-content {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
width: 100%;
height: 100%;
background-color: #efeff4;
}
.mui-pages {
top: 46px;
height: auto;
}
.mui-scroll-wrapper,
.mui-scroll {
background-color: #efeff4;
}
.mui-page.mui-transitioning {
-webkit-transition: -webkit-transform 200ms ease;
transition: transform 200ms ease;
}
.mui-page-left {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.mui-ios .mui-page-left {
-webkit-transform: translate3d(-20%, 0, 0);
transform: translate3d(-20%, 0, 0);
}
.mui-navbar {
position: fixed;
right: 0;
left: 0;
z-index: 10;
height: 44px;
background-color: #f7f7f8;
}
.mui-navbar .mui-bar {
position: absolute;
background: transparent;
text-align: center;
}
.mui-android .mui-navbar-inner.mui-navbar-left {
opacity: 0;
}
.mui-ios .mui-navbar-left .mui-left,
.mui-ios .mui-navbar-left .mui-center,
.mui-ios .mui-navbar-left .mui-right {
opacity: 0;
}
.mui-navbar .mui-btn-nav {
-webkit-transition: none;
transition: none;
-webkit-transition-duration: .0s;
transition-duration: .0s;
}
.mui-navbar .mui-bar .mui-title {
display: inline-block;
position: static;
width: auto;
}
.mui-page-shadow {
position: absolute;
right: 100%;
top: 0;
width: 16px;
height: 100%;
z-index: -1;
content: '';
}
.mui-page-shadow {
background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .01) 50%, rgba(0, 0, 0, .2) 100%);
background: linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .01) 50%, rgba(0, 0, 0, .2) 100%);
}
.mui-navbar-inner.mui-transitioning,
.mui-navbar-inner .mui-transitioning {
-webkit-transition: opacity 200ms ease, -webkit-transform 200ms ease;
transition: opacity 200ms ease, transform 200ms ease;
}
.mui-page {
display: none;
}
.mui-pages .mui-page {
display: block;
}
.mui-page .mui-table-view:first-child {
margin-top: 15px;
}
.mui-page .mui-table-view:last-child {
margin-bottom: 30px;
}
.mui-table-view {
margin-top: 20px;
}
.mui-table-view:after {
height: 0;
}
.mui-table-view span.mui-pull-right {
color: #999;
}
.mui-table-view-divider {
background-color: #efeff4;
font-size: 14px;
}
.mui-table-view-divider:before,
.mui-table-view-divider:after {
height: 0;
}
.mui-content-padded {
margin: 10px 0px;
}
.mui-locker {
margin: 35px auto;
display: none;
}
</style>
<link rel="stylesheet" type="text/css" href="./css/feedback-page.css" />
</head>
<body>
<!--页面主结构开始-->
<div id="app" class="mui-views">
<div class="mui-view">
<div class="mui-navbar">
</div>
<div class="mui-pages">
</div>
</div>
</div>
<!--页面主结构结束-->
<!--单页面开始-->
<div id="setting" class="mui-page">
<!--页面标题栏开始-->
<div class="mui-navbar-inner mui-bar mui-bar-nav">
<button type="button" class="mui-left mui-action-back mui-btn mui-btn-link mui-btn-nav mui-pull-left">
<span class="mui-icon mui-icon-left-nav"></span>
</button>
<h1 class="mui-center mui-title">设置</h1>
</div>
<!--页面标题栏结束-->
<!--页面主内容区开始-->
<div class="mui-page-content">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell">
<a id="rate" class="mui-navigate-right">评分鼓励</a>
</li>
<li class="mui-table-view-cell">
<a id="share" class="mui-navigate-right">分享推荐</a>
</li>
<li class="mui-table-view-cell">
<a id="tel" class="mui-navigate-right">客服电话</a>
</li>
<li class="mui-table-view-cell">
<a id="feedback-btn" href="#feedback" class="mui-navigate-right">问题反馈</a>
</li>
</ul>
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell">
<a href="#lock" class="mui-navigate-right">设置锁屏图案</a>
</li>
</ul>
<ul class="mui-table-view">
<li class="mui-table-view-cell" style="text-align: center;">
<a id='exit'>退出</a>
</li>
</ul>
</div>
</div>
</div>
<!--页面主内容区结束-->
</div>
<div id="notifications_disturb" class="mui-page">
<div class="mui-navbar-inner mui-bar mui-bar-nav">
<button type="button" class="mui-left mui-action-back mui-btn mui-btn-link mui-btn-nav mui-pull-left">
<span class="mui-icon mui-icon-left-nav"></span>新消息通知
</button>
<h1 class="mui-center mui-title">功能消息免打扰</h1>
</div>
<div class="mui-page-content">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
<ul class="mui-table-view mui-table-view-radio">
<li class="mui-table-view-cell">
<a class="mui-navigate-right">开启</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">只在夜间开启</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">关闭</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div id="lock" class="mui-page">
<div class="mui-navbar-inner mui-bar mui-bar-nav">
<button type="button" class="mui-left mui-action-back mui-btn mui-btn-link mui-btn-nav mui-pull-left">
<span class="mui-icon mui-icon-left-nav"></span>设置
</button>
<h1 class="mui-center mui-title">锁屏图案</h1>
</div>
<div class="mui-page-content">
<div class="mui-content-padded">
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell">
使用手势解锁
<div id="lockState" class="mui-switch">
<div class="mui-switch-handle"></div>
</div>
</li>
</ul>
<div class="mui-locker" data-locker-width='320' data-locker-height='320' data-locker-options='{"ringColor":"rgba(221,221,221,1)","fillColor":"#ffffff","pointColor":"rgba(0,136,204,1)","lineColor":"rgba(0,136,204,1)"}'>
</div>
</div>
</div>
</div>
<div id="feedback" class="mui-page feedback">
<div class="mui-navbar-inner mui-bar mui-bar-nav">
<button type="button" class="mui-left mui-action-back mui-btn mui-btn-link mui-btn-nav mui-pull-left">
<span class="mui-icon mui-icon-left-nav"></span>设置
</button>
<h1 class="mui-center mui-title">问题反馈</h1>
</div>
<div class="mui-page-content">
<p>问题和意见</p>
<div class="row mui-input-row">
<textarea id='question' class="mui-input-clear question" placeholder="请详细描述你的问题和意见..."></textarea>
</div>
<p>图片(选填,提供问题截图)</p>
<div id='image-list' class="row image-list">
</div>
<p>QQ/邮箱</p>
<div class="mui-input-row">
<input id='contact' type="text" class="mui-input-clear contact" placeholder="(选填,方便我们联系你 )" />
</div>
<button id='submit' type="button" class="mui-btn mui-btn-green">提交</button>
</div>
<p>此示例基于环信 “WebIM SDK” + 环信 “移动客服” 实现，在环信 “移动客服�
mui框架构建的手机版商城页面 （121个子文件） 
pro2.css 214KB mui.min.css 74KB mui.min.css 70KB app.css 16KB mui.picker.all.css 6KB mui.picker.min.css 5KB shopping-cart.css 4KB mui.dtpicker.css 3KB icons-extra.css 3KB mui.imageviewer.css 2KB iconfont.css 2KB feedback.css 2KB mui.picker.css 2KB mui.listpicker.css 2KB mui.indexedlist.css 2KB feedback-page.css 1KB mui.poppicker.css 1KB style.css 111B
60x60.gif 203B
setting.html 16KB new-shopping-card.html 13KB new-classification.html 13KB index.html 8KB login.html 8KB new-personal-details.html 6KB new-cooperation.html 5KB new-commodity.html 5KB new-newsCenter.html 5KB numbox.html 4KB new-mine.html 4KB reg.html 4KB new-add-address.html 4KB new-mine-grade.html 3KB unlock.html 3KB main.html 3KB new-buy.html 3KB forget_password.html 2KB new-mine-grade-record.html 2KB new-mine-order2.html 2KB new-mine-order3.html 2KB new-my-news.html 2KB new-mine-order6.html 2KB new-mine-order1.html 2KB new-mine-order7.html 2KB new-mine-order.html 2KB new-mine-order5.html 2KB new-mine-order4.html 2KB new-address.html 2KB
banner2.jpg 221KB banner1.jpg 148KB cbd.jpg 140KB muwu.jpg 112KB yuantiao.jpg 73KB shuijiao.jpg 69KB shop-bg.jpg 43KB hometit1.jpg 28KB echarts-all.js 950KB jquery-1.11.1.js 286KB mui.js 241KB city.data-3.js 181KB strophe-custom-2.0.0.js 174KB easemob.im-1.0.5.js 144KB mui.min.js 115KB mui.min.js 113KB jquery.min.js 91KB mui.picker.all.js 30KB city.data.js 24KB mui.view.js 20KB mui.view.js 20KB mui.picker.min.js 18KB json2.js 18KB mui.dtpicker.js 14KB mui.previewimage.js 13KB mui.pullToRefresh.js 12KB mui.listpicker.js 12KB mui.pullToRefresh.material.js 12KB mui.zoom.js 12KB mui.picker.js 11KB mui.locker.js 10KB mui.locker.js 10KB mui.imageViewer.js 9KB mui.lazyload.js 8KB feedback.js 7KB mui.indexedlist.js 6KB mui.poppicker.js 4KB arttmpl.js 4KB app.js 4KB beecloud.js 3KB feedback-page.js 3KB mui.lazyload.img.js 3KB feedback.js 3KB 95516.js 1KB update.js 1KB mui.enterfocus.js 574B ad.js 390B manifest.json 26KB manifest.json 10KB quickstart.md 25KB
list-ph01.png 168KB login-1.png 113KB共 121 条
- 1
- 2
资源评论
趙大叔2018-12-21仅供页面参考
丶丶无良2018-11-09就是简单的mui demo而已。不是商城。请举报
make198307232020-04-22简单的demo，不是完整的。参考价值无- lx1678782018-12-13看来被骗了
