代码如下
{{{
<div class="mui-off-canvas-wrap">
<div class="mui-inner-wrap">
<header class="mui-bar mui-bar-nav">
<a href="#offCanvas" class="mui-icon mui-icon-bars mui-pull-left"></a>
<h1 class="mui-title">广东文网</h1>
</header>
<aside id="offCanvas" class="mui-off-canvas-left">
<button id="offCanvasHide" class="mui-btn mui-btn-primary mui-btn-block">
关闭侧滑菜单(js call)
</button>
<ul class="mui-table-view mui-table-view-chevron mui-table-view-inverted">
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 1
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 2
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 3
</a>
</li>
</ul>
</aside>
<script>
mui.init({
swipeBack : false,
subpages : [{
id : 'list',
url : 'list.html',
styles : {
top : '80px',
bottom : 0,
bounce :'vertical'
//scrollIndicator : "none"
}
}]
});
</script>
<!-- off-canvas backdrop -->
<div class="mui-off-canvas-backdrop"></div>
</div>
</div>
<script>
mui.init({
swipeBack : false,
});
var offCanvasContainer = document.querySelector('.mui-off-canvas-wrap');
var offCanvasInnerContainer = offCanvasContainer.querySelector('.mui-inner-wrap');
var offCanvas = mui('#offCanvas');
document.getElementById('switch').addEventListener('toggle', function(event) {
if (event.detail.isActive) {//整体滑动时,侧滑菜单在inner-wrap内
offCanvasInnerContainer.insertBefore(offCanvas[0], offCanvasInnerContainer.firstElementChild);
} else {//仅主内容滑动时,侧滑菜单在off-canvas-wrap内
offCanvasContainer.insertBefore(offCanvas[0], offCanvasContainer.firstElementChild)
}
});
document.getElementById('offCanvasShow').addEventListener('tap', function() {
//offCanvas.offCanvas('toggle')//toggle or show;
offCanvas.offCanvas('show');
});
document.getElementById('offCanvasHide').addEventListener('tap', function() {
//offCanvas.offCanvas('toggle')//toggle or hide;
offCanvas.offCanvas('hide');
});
</script>
}}}
代码部分是抄mui hello 如何解决这个问题