//解决 所有a标签 导航不能跳转页面 mui('body').on('tap','a',function(){document.location.href=this.href;});
//解决MUI页面不会滚动的方法 (function($){ $(".mui-scroll-wrapper").scroll({ bounce: false,//滚动条是否有弹力默认是true indicators: true, //是否显示滚动条,默认是true }); })(mui);
下面是例子：
DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>title>
<script src="js/mui.min.js">script>
<link href="css/mui.min.css" rel="stylesheet"/>
<script type="text/javascript" charset="utf-8">
mui.init();
script>
head>
<body>
<div class="mui-off-canvas-wrap mui-draggable">
<div class="mui-inner-wrap">
<aside class="mui-off-canvas-left" id="offCanvasSide">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
<ul class="mui-table-view">
<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>
aside>
<header class="mui-bar mui-bar-nav">
<a class="mui-icon mui-action-menu mui-icon-bars mui-pull-left" href="#offCanvasSide">a>
<h1 class="mui-title">知识库h1>
header>
<nav class="mui-bar mui-bar-tab">
<a class="mui-tab-item mui-active">
<span class="mui-icon mui-icon-home">span>
<span class="mui-tab-label">首页span>
a>
<a class="mui-tab-item">
<span class="mui-icon mui-icon-phone">span>
<span class="mui-tab-label">电话span>
a>
<a class="mui-tab-item">
<span class="mui-icon mui-icon-email">span>
<span class="mui-tab-label">邮件span>
a>
<a class="mui-tab-item">
<span class="mui-icon mui-icon-gear">span>
<span class="mui-tab-label">设置span>
a>
nav>
<div class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<div id="slider" class="mui-slider" >
<div class="mui-slider-group mui-slider-loop">
<div class="mui-slider-item mui-slider-item-duplicate">
<a href="#">
<img src="images/4.jpg">
a>
div>
<div class="mui-slider-item">
<a href="#">
<img src="images/1.jpg">
a>
div>
<div class="mui-slider-item">
<a href="#">
<img src="images/2.jpg">
a>
div>
<div class="mui-slider-item">
<a href="#">
<img src="images/3.jpg">
a>
div>
<div class="mui-slider-item">
<a href="#">
<img src="images/4.jpg">
a>
div>
<div class="mui-slider-item mui-slider-item-duplicate">
<a href="#">
<img src="images/1.jpg">
a>
div>
div>
<div class="mui-slider-indicator">
<div class="mui-indicator mui-active">div>
<div class="mui-indicator">div>
<div class="mui-indicator">div>
<div class="mui-indicator">div>
div>
div>
<ul class="mui-table-view mui-grid-view mui-grid-9">
<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
<a href="knowledge.html">
<span class="mui-icon mui-icon-home">span>
<div class="mui-media-body">Homediv>
a>
li>
<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
<a href="#">
<span class="mui-icon mui-icon-email"><span class="mui-badge mui-badge-red">5span>span>
<div class="mui-media-body">Emaildiv>
a>
li>
<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
<a href="#">
<span class="mui-icon mui-icon-chatbubble">span>
<div class="mui-media-body">Chatdiv>
a>
li>
<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
<a href="#">
<span class="mui-icon mui-icon-location">span>
<div class="mui-media-body">Locationdiv>
a>
li>
<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
<a href="#">
<span class="mui-icon mui-icon-search">span>
<div class="mui-media-body">Searchdiv>
a>
li>
<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
<a href="#">
<span class="mui-icon mui-icon-phone">span>
<div class="mui-media-body">Phonediv>
a>
li>
ul>
<ul class="mui-table-view">
<li class="mui-table-view-cell mui-media">
<a href="javascript:;">
<img class="mui-media-object mui-pull-right" src="http://placehold.it/40x30">
<div class="mui-media-body">
幸福
<p class="mui-ellipsis">能和心爱的人一起睡觉，是件幸福的事情；可是，打呼噜怎么办？p>
div>
a>
li>
<li class="mui-table-view-cell mui-media">
<a href="javascript:;">
<img class="mui-media-object mui-pull-right" src="http://placehold.it/40x30">
<div class="mui-media-body">
木屋
<p class="mui-ellipsis">想要这样一间小木屋，夏天挫冰吃瓜，冬天围炉取暖.p>
div>
a>
li>
<li class="mui-table-view-cell mui-media">
<a href="javascript:;">
<img class="mui-media-object mui-pull-right" src="http://placehold.it/40x30">
<div class="mui-media-body">
CBD
<p class="mui-ellipsis">烤炉模式的城，到黄昏，如同打翻的调色盘一般.p>
div>
a>
li>
ul>
<ul class="mui-table-view">
<li class="mui-table-view-cell mui-collapse">
<a class="mui-navigate-right" href="#">面板1a>
<div class="mui-collapse-content">
<p>面板1子内容p>
div>
li>
<li class="mui-table-view-cell mui-collapse">
<a class="mui-navigate-right" href="#">面板a>
<div class="mui-collapse-content">
<p>面板2子内容p>
div>
li>
<li class="mui-table-view-cell mui-collapse">
<a class="mui-navigate-right" href="#">面板3a>
<div class="mui-collapse-content">
<p>面板3子内容p>
div>
li>
ul>
<div class="mui-progressbar">
<span>span>
div>
<div class="mui-input-row mui-input-range">
<label>Rangelabel>
<input type="range" min="0" max="100" value="50">
div>
div>
div>
<div class="mui-off-canvas-backdrop">div>
div>
div>
<script type="text/javascript">
(function($){
$(".mui-scroll-wrapper").scroll({
bounce: false,//滚动条是否有弹力默认是true
indicators: true, //是否显示滚动条,默认是true
});
})(mui);
mui(".mui-progressbar").progressbar({progress:50}).show();
//解决 所有a标签 导航不能跳转页面
mui('body').on('tap','a',function(){document.location.href=this.href;});
script>
body>
html>