feat: scroll focused inputs into view on virtual keyboard open
This commit is contained in:
@@ -47,6 +47,17 @@ function trapFocus(container) {
|
|||||||
};
|
};
|
||||||
container.addEventListener('keydown', focusTrapHandler);
|
container.addEventListener('keydown', focusTrapHandler);
|
||||||
|
|
||||||
|
// Virtual Keyboard: Focused Input in sichtbaren Bereich scrollen
|
||||||
|
function onInputFocus(e) {
|
||||||
|
const tag = e.target.tagName;
|
||||||
|
if (tag !== 'INPUT' && tag !== 'TEXTAREA' && tag !== 'SELECT') return;
|
||||||
|
setTimeout(() => {
|
||||||
|
e.target.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
||||||
|
}, 300);
|
||||||
|
}
|
||||||
|
container.addEventListener('focusin', onInputFocus);
|
||||||
|
container._onInputFocus = onInputFocus;
|
||||||
|
|
||||||
// Focus first focusable element
|
// Focus first focusable element
|
||||||
const first = container.querySelector(FOCUSABLE);
|
const first = container.querySelector(FOCUSABLE);
|
||||||
if (first) {
|
if (first) {
|
||||||
@@ -152,6 +163,12 @@ export function closeModal() {
|
|||||||
focusTrapHandler = null;
|
focusTrapHandler = null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Virtual-Keyboard-Listener entfernen
|
||||||
|
const panel = activeOverlay.querySelector('.modal-panel');
|
||||||
|
if (panel?._onInputFocus) {
|
||||||
|
panel.removeEventListener('focusin', panel._onInputFocus);
|
||||||
|
}
|
||||||
|
|
||||||
activeOverlay.remove();
|
activeOverlay.remove();
|
||||||
activeOverlay = null;
|
activeOverlay = null;
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user