HTML tiene elementos desplazables. En un momento dado, uno de ellos recibirá controles de desplazamiento del teclado como flecha arriba/abajo, página arriba/página abajo, etc.
¿Cómo puedo averiguar qué elemento está actualmente activo de esta manera y cómo puedo hacer que un elemento esté activo de esta manera?
Aquí está jsfiddle para demostrar el problema .
Puedo hacer clic en e1 , e2 , e3 o e4 . Si lo hago, las teclas de flecha desplazarán ese elemento.
La forma obvia de hacer esto sería llamar a element.focus() . Pero eso no hace nada cuando se llama a un div desplazable, y document.activeElement sigue apuntando al body no a ninguno de ellos (el que está realmente activo o el que intenté activar).
Asi que:
tabindex para acceder a este estado a través de JS, aunque los navegadores pueden manejar el estado de desplazamiento activo sin ningún tabindex por sí mismos?Use detectores de eventos para hacerlo
function gg1(){ document.getElementById("focused").innerText = "e1" } function gg2(){ document.getElementById("focused").innerText = "e2" } document.getElementById("e1").addEventListener("scroll", gg1); document.getElementById("e2").addEventListener("scroll",gg2);Este código es solo la versión básica de cómo podría lograrlo. Siempre puedes minimizarlo.