diff --git a/game.js b/game.js index 04e77c9..81191c8 100644 --- a/game.js +++ b/game.js @@ -436,9 +436,9 @@ class Game { const hint = document.getElementById('map-talk-hint'); const bub = document.getElementById('npc-bubble'); if (hint) { + hint.style.display = near ? 'block' : 'none'; hint.style.left = (viewW / 2 - 28) + 'px'; hint.style.bottom = (viewH * 0.50) + 'px'; - hint.classList.toggle('visible', near); } if (bub) bub.style.opacity = near ? '0' : '1'; this._updateDirArrow(near); @@ -492,18 +492,18 @@ class Game { const viewH = world ? world.parentElement.offsetHeight : 300; const p = document.getElementById('map-player'); - const bub = document.getElementById('player-bubble'); if (p) { const left = viewW / 2 - 16; const bottom = viewH * 0.28; - p.style.left = left + 'px'; - p.style.bottom = bottom + 'px'; - p.className = 'map-player idle'; - if (bub) { bub.style.left = (left - 4) + 'px'; bub.style.bottom = (bottom + 64) + 'px'; } + p.style.left = left + 'px'; + p.style.bottom = bottom + 'px'; + p.className = 'map-player idle'; + const bub = document.getElementById('player-bubble'); + if (bub) { bub.style.left = (left - 4) + 'px'; bub.style.bottom = (bottom + 66) + 'px'; } } this._applyCamera(); const hint = document.getElementById('map-talk-hint'); - if (hint) hint.classList.remove('visible'); + if (hint) hint.style.display = 'none'; } /* ══════════════════════════════════════════════════════════ diff --git a/style.css b/style.css index c9c36b7..5b33665 100644 --- a/style.css +++ b/style.css @@ -481,7 +481,7 @@ html, body { bottom: -9999px; } /* NPC lives inside .map-inner, positioned in world-px via JS */ -.map-npc-wrap { position:absolute; text-align:center; z-index: 30; left: -9999px; } +.map-npc-wrap { position:absolute; text-align:center; z-index: 30; } .npc-bubble { font-size:14px; font-family:var(--font); color:var(--black); background:var(--yellow); border:2px solid var(--black); width:20px; height:20px; display:flex; align-items:center; justify-content:center; margin:0 auto 2px; animation:bounce .7s ease-in-out infinite; } .map-npc { font-size:clamp(36px,10vw,52px); filter:drop-shadow(2px 3px 0 rgba(0,0,0,.35)); cursor:pointer; } /* Player is fixed to the viewport centre horizontally; only Y moves */ @@ -550,13 +550,8 @@ html, body { padding: 3px 6px; white-space: nowrap; z-index: 11; - pointer-events: none; - display: none; - bottom: -9999px; -} -.map-talk-hint.visible { - display: block; animation: talkBubble .6s ease-in-out infinite; + pointer-events: none; } /* Desktop: show "Press E", hide "Press A" */ .hint-touch { display: none; }