好资源导航 » 文章资讯 » MUI 实现侧滑菜单及其主体部分上下滑动的方法

MUI 实现侧滑菜单及其主体部分上下滑动的方法

2023-09-17 08:55:05 60

在MUI文档的侧滑菜单介绍里没有说明如何实现侧滑，而MUI侧滑菜单默认是没有上下滑动功能的，需要激活。

1、首先在class="mui-scroll-wrapper"的元素上添加ID：

...

标题

...

从上面例子可以看出，侧滑菜单和主体部分都添加了ID。

分别为：offCanvasSideScroll、offCanvasContentScroll

2、其次在JS里面激活：

mui('#offCanvasSideScroll').scroll();
mui('#offCanvasContentScroll').scroll();

大功告成，现在超过高度即可进行下滑了。注意是超过高度！就像浏览器一样，如果“主界面具体展示内容”没有超出范围，是没有下滑功能的。

MUI：MUI侧滑菜单。

完整代码：











	body{
		background-color:#000000;
	}
	.mui-off-canvas-wrap{
		max-width:720px;
		margin:0auto;
	}



	
	
	
	
	
	
	
	
		
	
	
	
	
	
	
	
	
	
	标题
	
	
	
	
	
		
	
	
	
	
	
	
	
		$("#left-menu").on('tap',function(event){
			mui('.mui-off-canvas-wrap').offCanvas('show');
		});
		
		window.onload=function(){
		mui('#offCanvasSideScroll').scroll();
			mui('#offCanvasContentScroll').scroll();
		}

以上这篇MUI实现侧滑菜单及其主体部分上下滑动的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。

返回顶部
514930285
czq8825@qq.com

MUI 实现侧滑菜单及其主体部分上下滑动的方法

热门推荐

随机推荐