完美解决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 相关文章推荐
Javascript load Page,load css,load js实现代码
Mar 31 Javascript
jquery实现弹出div,始终显示在屏幕正中间的简单实例
Mar 08 Javascript
JavaScript中getUTCMinutes()方法的使用详解
Jun 10 Javascript
使用AngularJS实现表单向导的方法
Jun 19 Javascript
jQuery实现模拟marquee标签效果
Jul 14 Javascript
封装属于自己的JS组件
Jan 27 Javascript
JavaScript手机振动API
Jun 11 Javascript
Jquery实现遮罩层的简单实例(就是弹出DIV周围都灰色不能操作)
Jul 14 Javascript
js实现带简单弹性运动的导航条
Feb 22 Javascript
JS实现身份证输入框的输入效果
Aug 21 Javascript
Node.js API详解之 util模块用法实例分析
May 09 Javascript
JavaScript设计模式---单例模式详解【四种基本形式】
May 16 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的输出:缓存并压缩动态页面
2013/06/11 PHP
php过滤XSS攻击的函数
2013/11/12 PHP
php编译安装php-amq扩展简明教程
2016/06/25 PHP
使用Zttp简化Guzzle 调用
2017/07/02 PHP
event.keyCode键码值表 附只能输入特定的字符串代码
2009/05/15 Javascript
分享Javascript中最常用的55个经典小技巧
2013/11/29 Javascript
node.js中的socket.io的广播消息
2014/12/15 Javascript
用svg制作富有动态的tooltip
2015/07/17 Javascript
jQuery三级下拉列表导航菜单代码分享
2020/04/15 Javascript
实例讲解Jquery中隐藏hide、显示show、切换toggle的用法
2016/05/13 Javascript
js实现百度地图定位于地址逆解析,显示自己当前的地理位置
2016/12/08 Javascript
JS实现无缝循环marquee滚动效果
2017/05/22 Javascript
详解nodejs通过代理(proxy)发送http请求(request)
2017/09/22 NodeJs
nginx部署访问vue-cli搭建的项目的方法
2018/02/12 Javascript
vue.js实现标签页切换效果
2018/06/07 Javascript
详解vue-router传参的两种方式
2018/09/10 Javascript
解决vue项目打包上服务器显示404错误,本地没出错的问题
2020/11/03 Javascript
python单线程实现多个定时器示例
2014/03/30 Python
浅析python实现scrapy定时执行爬虫
2018/03/04 Python
对Python中for复合语句的使用示例讲解
2018/11/01 Python
PyQt5创建一个新窗口的实例
2019/06/20 Python
Django对models里的objects的使用详解
2019/08/17 Python
pytorch 使用单个GPU与多个GPU进行训练与测试的方法
2019/08/19 Python
python文件处理fileinput使用方法详解
2020/01/02 Python
python实现梯度法 python最速下降法
2020/03/24 Python
python的pip有什么用
2020/06/17 Python
Python:__eq__和__str__函数的使用示例
2020/09/26 Python
HTML5之SVG 2D入门12—SVG DOM及DOM操作介绍
2013/01/30 HTML / CSS
加拿大最大的箱包及旅游配件零售商:Bentley Leathers
2017/07/19 全球购物
日本最大的药妆连锁店:Matsukiyo松本清药妆店
2017/11/23 全球购物
Sneaker Studio捷克:购买运动鞋
2018/07/08 全球购物
某个公司的Java笔面试题
2016/03/11 面试题
三八妇女节标语
2014/10/09 职场文书
个人催款函范文
2015/06/23 职场文书
python编程项目中线上问题排查与解决
2021/11/01 Python
介绍一下28个JS常用数组方法
2022/05/06 Javascript