diff --git a/admin/css/admin.css b/admin/css/admin.css
index 3552681..be2bd71 100644
--- a/admin/css/admin.css
+++ b/admin/css/admin.css
@@ -37,10 +37,6 @@ body,
 .pear-admin .layui-layout-control {
 	left: 140px;
 	position: absolute;
-	width: 505px;
-	white-space: nowrap;
-	overflow-x: scroll;
-	overflow: hidden;
 }
 
 .pear-admin .layui-layout-control .layui-nav{
diff --git a/component/pear/module/admin.js b/component/pear/module/admin.js
index 3e05273..581237b 100644
--- a/component/pear/module/admin.js
+++ b/component/pear/module/admin.js
@@ -93,6 +93,7 @@ layui.define(['message', 'table', 'jquery', 'element', 'yaml', 'form', 'tab', 'm
 					height: '100%',
 					method: param.menu.method,
 					control: param.menu.control ? 'control' : false, // control
+					controlWidth: param.menu.controlWidth,
 					defaultMenu: 0,
 					accordion: param.menu.accordion,
 					url: param.menu.data,
@@ -534,31 +535,5 @@ layui.define(['message', 'table', 'jquery', 'element', 'yaml', 'form', 'tab', 'm
 			}
 		}
 
-		$("#control").on("mousewheel DOMMouseScroll", function(event) {
-
-			var delta = (event.originalEvent.wheelDelta && (event.originalEvent.wheelDelta > 0 ? 1 : -1)) || // chrome & ie
-				(event.originalEvent.detail && (event.originalEvent.detail > 0 ? -1 : 1)); // firefox
-
-			if (delta > 0) {
-				for (var num = 1; num < 20; num++) {
-					setTimeout(function() {
-						if ($("#control ul").css('left').replace("px", "") < 0) {
-							$("#control ul").css("left", "+=2px");
-						}
-					}, 10)
-				}
-			} else if (delta < 0) {
-			
-				if(( (Number)($("#control ul").css("left").replace("px","")) + ($("#control ul").width() - $("#control").width())) > 0){
-					for (var num = 1; num < 20; num++) {
-						setTimeout(function() {
-							$("#control ul").css("left", "-=2px");
-						}, 10)
-					}
-				}
-			}
-			console.log(delta);
-		});
-
 		exports('admin', pearAdmin);
 	})
diff --git a/component/pear/module/menu.js b/component/pear/module/menu.js
index 33c0df8..22edb64 100644
--- a/component/pear/module/menu.js
+++ b/component/pear/module/menu.js
@@ -20,6 +20,7 @@ layui.define(['table', 'jquery', 'element'], function(exports) {
 			defaultOpen: opt.defaultOpen,
 			defaultSelect: opt.defaultSelect,
 			control: opt.control,
+			controlWidth: opt.controlWidth ? opt.controlWidth: 500,
 			defaultMenu: opt.defaultMenu,
 			accordion: opt.accordion,
 			height: opt.height,
@@ -47,6 +48,33 @@ layui.define(['table', 'jquery', 'element'], function(exports) {
 		
 		// 处理高度
 		$("#"+opt.elem).height(option.height)
+		
+		setTimeout(function(){
+			$("#"+opt.control+" .control").on("mousewheel DOMMouseScroll", function(event) {
+				
+				var delta = (event.originalEvent.wheelDelta && (event.originalEvent.wheelDelta > 0 ? 1 : -1)) || // chrome & ie
+					(event.originalEvent.detail && (event.originalEvent.detail > 0 ? -1 : 1)); // firefox
+			
+				if (delta > 0) {
+					for (var num = 1; num < 20; num++) {
+						setTimeout(function() {
+							if ($("#"+opt.control+" .control ul").css('left').replace("px", "") < 0) {
+								$("#"+opt.control+" .control ul").css("left", "+=2px");
+							}
+						}, 10)
+					}
+				} else if (delta < 0) {
+					if(( (Number)($("#"+opt.control+" .control ul").css("left").replace("px","")) + ($("#"+opt.control+" .control ul").width() - $("#"+opt.control+" .control").width())) > 0){
+						for (var num = 1; num < 20; num++) {
+							setTimeout(function() {
+								$("#"+opt.control+" .control ul").css("left", "-=2px");
+							}, 10)
+						}
+					}
+				}
+			});
+		},1000)
+		
 		return new pearMenu(opt);
 	}
 
@@ -234,7 +262,7 @@ layui.define(['table', 'jquery', 'element'], function(exports) {
 	}
 
 	function createMenuAndControl(option) {
-		var control = '<ul class="layui-nav pear-nav-control pc layui-hide-xs" style="width: fit-content;margin: auto;">';
+		var control = '<div style="width: '+ option.controlWidth +'px;white-space: nowrap;overflow-x: scroll;overflow: hidden;" class="control"><ul class="layui-nav pear-nav-control pc layui-hide-xs" style="width: fit-content;margin: auto;">';
 		var controlPe = '<ul class="layui-nav pear-nav-control layui-hide-sm">';
 		// 声 明 头 部
 		var menu = '<div class="layui-side-scroll ' + option.theme + '">'
@@ -297,7 +325,7 @@ layui.define(['table', 'jquery', 'element'], function(exports) {
 		})
 		controlItemPe += "</li></dl></ul>"
 		controlPe += controlItemPe;
-		$("#" + option.control).html(control);
+		$("#" + option.control).html(control+"</div>");
 		$("#" + option.control).append(controlPe);
 		$("#" + option.elem).html(menu);
 		$("#" + option.control + " .pear-nav-control").on("click", "[pear-id]", function() {
diff --git a/component/pear/pear.js b/component/pear/pear.js
index 61d5583..fa2cf23 100644
--- a/component/pear/pear.js
+++ b/component/pear/pear.js
@@ -5,7 +5,7 @@ window.rootPath = (function(src) {
 
 layui.config({
 	base: rootPath + "module/",
-	version: "3.8.6"
+	version: "3.8.7"
 }).extend({
 	admin: "admin", 	// 框架布局组件
 	menu: "menu",		// 数据菜单组件
diff --git a/config/pear.config.yml b/config/pear.config.yml
index d45f39b..c0a67a6 100644
--- a/config/pear.config.yml
+++ b/config/pear.config.yml
@@ -17,6 +17,8 @@ menu:
   collaspe: false
   ## 是否开启多系统菜单模式
   control: false
+  ## 顶部菜单宽度 PX
+  controlWidth: 500
   ## 默认选中的菜单项
   select: "10"
   ## 是否开启异步菜单，false 时 data 属性设置为菜单数据，false 时为 json 文件或后端接口