diff --git a/emccpre.js b/emccpre.js index 2e1508c..b050cf0 100644 --- a/emccpre.js +++ b/emccpre.js @@ -525,6 +525,25 @@ function initPuzzle() { command(4); }); + // Event handlers to fake :focus-within on browsers too old for + // it (like KaiOS 2.5). Browsers without :focus-within are also + // too old for focusin/out events, so we have to use focus and + // which don't bubble but can be captured. + menuform.addEventListener("focus", function(event) { + var elem = event.target; + while (elem && elem !== menuform) { + elem.classList.add("focus-within"); + elem = elem.parentElement; + } + }, true); + menuform.addEventListener("blur", function(event) { + var elem = event.target; + while (elem && !elem.contains(event.relatedTarget)) { + elem.classList.remove("focus-within"); + elem = elem.parentElement; + } + }, true); + // Set up the function pointers we haven't already grabbed. dlg_return_sval = Module.cwrap('dlg_return_sval', 'void', ['number','string']); diff --git a/html/jspage.pl b/html/jspage.pl index ec67a4d..5376a9a 100755 --- a/html/jspage.pl +++ b/html/jspage.pl @@ -128,7 +128,7 @@ EOF } #gamemenu li > :hover:not(:disabled), -#gamemenu li > :focus-within { +#gamemenu li > .focus-within { /* When the mouse is over a menu item, highlight it */ background: rgba(0,0,0,0.3); } @@ -186,7 +186,7 @@ EOF } #gamemenu :hover > ul, -#gamemenu :focus-within > ul { +#gamemenu .focus-within > ul { /* Last but by no means least, the all-important line that makes * submenus be displayed! Any