0

I am looking for a way to trigger some functionality whenever a user hovers an element and while hovering it, I want the user to press a key.

Simply stacking multiple event handlers won't do the trick as you can see below.

allFocusableElements.forEach((link) => {
  link.addEventListener('mouseover', () => {
    link.addEventListener('keyup', (e) => {
      if (e.keyCode === 70) {
        link.focus();
      }
    });
  });
});

Any help is greatly appreciated.

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
James Perrone
  • 97
  • 1
  • 8
  • Use a global `IsHovering` variable that you set/unset using the mouseover/leave events. Then in your keyup event, check the `IsHovering` variable. If you need handle it separately for different links, then consider a 2nd global variable that tracks which link is being hovered. – musefan Jun 18 '18 at 10:12
  • @musefan Do you mind accepting the question so I can accept your answer? – James Perrone Jun 18 '18 at 10:19
  • I can't answer the question as it has been closed as a duplicate, the answers on the duplicate seem pretty close to what I was suggesting anyway – musefan Jun 18 '18 at 10:20

0 Answers0