CONTEXT : Many <img tabindex="x"
one under an other. When any user press tab: it "goes" to the next item, surround the item with blue border and the voice readers reads the alt text (or any tab behaviour...) [that's only an example].
WHAT I WANT : that when a user hit (on his keyboard) the key "down" => that it triggers the SAME behaviour as the tab = go to the next tabindex and read the alt text or what behaviour that a normal tab does.
NOTE : This question is NOT about the voice reading thing => it's ONLY to give an example of what a normal tabs does
WHAT I DON'T WANT : .focus() because it applies to inputs, here my tab index goes to the nest image.
WHAT I TRIED : without success (unless I misstype something)
$("html").keydown(function(e) {
if (e.keyCode==40) {
console.log("key down was pressed");
document.dispatchEvent( new window.KeyboardEvent('keydown', { key : 'Tab' }) );
}
}
in this code the console.log gets triggered and I see "key down was pressed" but no tab was triggered.
Is there a way to do what I describe ?