完美解决mui框架off-canvas侧滑超出部分隐藏无法滚动的问题


Posted in Javascript onJanuary 25, 2018

mui框架中off-canvas侧滑的一个缺点就是无法出现滚动条,因为它主要用途是设置类似于qq界面的那种格局,所以才无法滚动。那么如何解决这个问题呢?

解决方法:

一、在内容容器加上id,然后通过JS控制

<div class="mui-content mui-scroll-wrapper" id="scr1">

JS部分

<script>
mui('#scr1').scroll();
</script>

二、利用创建子页面的方式:

mui.init({
subpages:[{
url:'index.html',   //要引入的页面
id:'index.html' , //要引入页面的标志
style:{
top:'50px',   //页面顶部的位置
bottom:'0px'
}
extrax{}    //额外扩展参数
}]
});

在index.html页面中就可以写内容了,而且会出现滚动条

以上这篇完美解决mui框架off-canvas侧滑超出部分隐藏无法滚动的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
运用jquery实现table单双行不同显示并能单行选中
Jul 25 Javascript
对 lightbox JS 图片控件进行了一下改造, 使其他支持复杂的图片说明
Mar 20 Javascript
基于javascript编写简单日历
May 02 Javascript
总结Node.js中的一些错误类型
Aug 15 Javascript
HTML中setCapture、releaseCapture 使用方法浅析
Sep 25 Javascript
Bootstrap基本插件学习笔记之Popover提示框(19)
Dec 08 Javascript
浅谈Node.js:fs文件系统模块
Dec 08 Javascript
从零学习node.js之mysql数据库的操作(五)
Feb 24 Javascript
JavaScript实现一个简易的计算器实例代码
May 10 Javascript
vue-cli项目无法用本机IP访问的解决方法
Sep 20 Javascript
通过实例了解js函数中参数的传递
Jun 15 Javascript
Vue检测屏幕变化来改变不同的charts样式实例
Oct 26 Javascript
vue2.0 better-scroll 实现移动端滑动的示例代码
Jan 25 #Javascript
mui框架 页面无法滚动的解决方法(推荐)
Jan 25 #Javascript
vue使用 better-scroll的参数和方法详解
Jan 25 #Javascript
Vue cli+mui 区域滚动的实例代码
Jan 25 #Javascript
基于vue开发的在线付费课程应用过程
Jan 25 #Javascript
基于vue 开发中出现警告问题去除方法
Jan 25 #Javascript
关于express与koa的使用对比详解
Jan 25 #Javascript
You might like
PHP页面输出时js设置input框的选中值
2016/09/30 PHP
PHP使用ajax的post方式下载excel文件简单示例
2019/08/06 PHP
javascript下数值型比较难点说明
2010/06/07 Javascript
jqGrid jQuery 表格插件测试代码
2011/08/23 Javascript
封装了一个js图片轮换效果的函数
2011/09/28 Javascript
javascript自启动函数的问题探讨
2013/10/05 Javascript
javascript中使用正则计算中文长度的例子
2014/04/29 Javascript
模拟javascript中的sort排序(简单实例)
2016/08/17 Javascript
js实现html table 行,列锁定的简单实例
2016/10/13 Javascript
jquery+Jscex打造游戏力度条
2020/09/12 Javascript
jQuery中checkbox反复调用attr('checked', true/false)只有第一次生效的解决方法
2016/11/16 Javascript
利用require.js与angular搭建spa应用的方法实例
2017/07/19 Javascript
浅谈React组件之性能优化
2018/03/02 Javascript
AngularJS 应用模块化的使用
2018/04/04 Javascript
微信小程序常用赋值方法小结
2019/04/30 Javascript
taro小程序添加骨架屏的实现代码
2019/11/15 Javascript
详解JavaScript中的Object.is()与&quot;===&quot;运算符总结
2020/06/17 Javascript
微信小程序实现列表滚动头部吸顶的示例代码
2020/07/12 Javascript
如何使用gpu.js改善JavaScript的性能
2020/12/01 Javascript
5款非常棒的Python工具
2018/01/05 Python
python模拟事件触发机制详解
2018/01/19 Python
Python变量赋值的秘密分享
2018/04/03 Python
Python使用wget实现下载网络文件功能示例
2018/05/31 Python
scrapy-redis的安装部署步骤讲解
2019/02/27 Python
Django Rest framework解析器和渲染器详解
2019/07/25 Python
python实现微信小程序用户登录、模板推送
2019/08/28 Python
Tensorflow tf.nn.atrous_conv2d如何实现空洞卷积的
2020/04/20 Python
使用 prometheus python 库编写自定义指标的方法(完整代码)
2020/06/29 Python
基于python实现简单C/S模式代码实例
2020/09/14 Python
python 发送邮件的示例代码(Python2/3都可以直接使用)
2020/12/03 Python
运动会入场词60字
2014/02/15 职场文书
大学同学会活动方案
2014/08/20 职场文书
小区的门卫岗位职责
2014/10/01 职场文书
保研推荐信格式
2015/03/25 职场文书
党员廉政准则心得体会
2016/01/20 职场文书
选对餐饮营销策略,营业额才会上涨
2019/08/27 职场文书