.home-land-container { width: 100%; height: 100vh; overflow: hidden; position: relative; .scroll-container { width: 100%; height: 100%; position: relative; overflow: hidden; touch-action: pan-x; } /* 第三层:背景层 */ .background-layer { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, #265f9f, #4682B4); /* 渐变背景 */ z-index: 1; /* 最底层 */ user-select: none; /* 禁止选中 */ pointer-events: none; /* 禁止交互 */ } /* 第二层:地图层(可拖动) */ .map-layer { position: fixed; bottom: 0; left: 0; width: 1536rpx; /* 地图比屏幕大 */ height: 100%; z-index: 2; /* 中间层 */ cursor: grab; /* 拖动光标 */ } /* 第一层:UI层(最上层) */ .ui-layer { position: fixed; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; z-index: 100; /* UI层内部元素需要启用交互 */ .ui-content { position: absolute; top: 120rpx; right: 20rpx; pointer-events: none; /* 默认不接收事件 */ z-index: 101; display: flex; flex-direction: column; align-items: flex-end; } .currency-display { display: flex; flex-direction: row; gap: 20rpx; margin-bottom: 20rpx; padding: 10rpx; pointer-events: auto; /* 货币计数器接收事件 */ .currency-item { display: flex; align-items: center; background: url('/static/island/UI/money_kuang.png') no-repeat center center; background-size: 100% 100%; padding: 12rpx 24rpx; border-radius: 50rpx; box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1); .currency-icon { width: 40rpx; height: 40rpx; margin-right: 12rpx; margin-left: -8rpx; } .currency-value { font-size: 28rpx; color: #FFFFFF; font-weight: bold; text-shadow: -1px -1px 0 #316624, 1px -1px 0 #316624, -1px 1px 0 #316624, 1px 1px 0 #316624; } } } .ui-buttons { display: flex; flex-direction: column; gap: 20rpx; pointer-events: auto; /* 按钮接收事件 */ .ui-button { background: rgba(255, 255, 255, 0.9); border: none; padding: 16rpx 32rpx; border-radius: 8rpx; font-size: 28rpx; color: #333; box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1); min-width: 120rpx; &:active { opacity: 0.8; transform: scale(0.95); } } } } /* 示例按钮样式 */ .dialog-button { pointer-events: auto; /* 重新启用交互 */ background: white; padding: 10px 20px; border-radius: 5px; box-shadow: 0 2px 5px rgba(0,0,0,0.2); } text { font-size: 16px; color: #333; } }