From aae33fbfb21b91b5678644d4e7fae44465a9942e Mon Sep 17 00:00:00 2001 From: shuaiplus <2327005759@qq.com> Date: Mon, 5 May 2025 16:30:37 +0800 Subject: [PATCH] =?UTF-8?q?mousemove=20=E4=BA=8B=E4=BB=B6=E4=BC=98?= =?UTF-8?q?=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/main.js | 65 ++++++++++++++++++++++++++--------------------------- 1 file changed, 32 insertions(+), 33 deletions(-) diff --git a/web/main.js b/web/main.js index b55d73e..c970004 100644 --- a/web/main.js +++ b/web/main.js @@ -359,14 +359,44 @@ function setupMoreBtnMenu() { const menu = document.getElementById('more-menu'); if (!btn || !menu) return; let menuRect = null; - let closeTimer = null; let animating = false; + let isMouseMoveBound = false; + + function onMouseMove(ev) { + if (!menuRect) return; + const mx = ev.clientX, my = ev.clientY; + const btnRect = btn.getBoundingClientRect(); + const safe = 100; + const inMenu = + mx >= menuRect.left - safe && mx <= menuRect.right + safe && + my >= menuRect.top - safe && my <= menuRect.bottom + safe; + const inBtn = + mx >= btnRect.left - safe && mx <= btnRect.right + safe && + my >= btnRect.top - safe && my <= btnRect.bottom + safe; + if (!inMenu && !inBtn) { + closeMenu(); + } + } + + function bindMouseMove() { + if (!isMouseMoveBound) { + window.addEventListener('mousemove', onMouseMove); + isMouseMoveBound = true; + } + } + function unbindMouseMove() { + if (isMouseMoveBound) { + window.removeEventListener('mousemove', onMouseMove); + isMouseMoveBound = false; + } + } function openMenu() { menu.classList.remove('close'); menu.classList.add('open'); menu.style.display = 'block'; menuRect = menu.getBoundingClientRect(); + bindMouseMove(); } function closeMenu() { if (animating) return; @@ -376,6 +406,7 @@ function setupMoreBtnMenu() { setTimeout(() => { if (menu.classList.contains('close')) menu.style.display = 'none'; animating = false; + unbindMouseMove(); }, 180); menuRect = null; } @@ -419,38 +450,6 @@ function setupMoreBtnMenu() { } }; - function onMouseMove(ev) { - if (!menuRect) return; - const mx = ev.clientX, my = ev.clientY; - const btnRect = btn.getBoundingClientRect(); - const safe = 100; - const inMenu = - mx >= menuRect.left - safe && mx <= menuRect.right + safe && - my >= menuRect.top - safe && my <= menuRect.bottom + safe; - const inBtn = - mx >= btnRect.left - safe && mx <= btnRect.right + safe && - my >= btnRect.top - safe && my <= btnRect.bottom + safe; - if (!inMenu && !inBtn) { - closeMenu(); - window.removeEventListener('mousemove', onMouseMove); - } - } - - menu.addEventListener('mouseenter', function() { - window.addEventListener('mousemove', onMouseMove); - }); - menu.addEventListener('mouseleave', function() { - window.addEventListener('mousemove', onMouseMove); - }); - btn.addEventListener('mouseleave', function() { - window.addEventListener('mousemove', onMouseMove); - }); - btn.addEventListener('click', function() { - if (menu.classList.contains('open')) { - window.addEventListener('mousemove', onMouseMove); - } - }); - document.addEventListener('click', function hideMenu(ev) { if (!menu.contains(ev.target) && ev.target !== btn) { closeMenu();