Skip to content

A library to help trap the focus of keyboard inside an element.

License

Notifications You must be signed in to change notification settings

ramlmn/trap-keyboard

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

TrapKeyboard.js

A library to help trap the focus of keyboard inside an element.

Warn: Don't trap the users keyboard unless the usecase is so, it might be a usability issue rather than providing accessibility

Refer to https://youtu.be/JS68faEUduk?t=10m56s

You'r usecase might be suited by inert https://youtu.be/fGLp_gfMMGU

Usage:

Using the TrapKeyboard class:

const trap = new TrapKeyboard(root, options);

// Call the 'trap' method
trap.trap();

Arguments

root: Element to trap keyboard inside of.

options: MutationObserverInit object for responding to changes on root and child elements.

To untrap the keyboard, just call the unTrap method on the instance:

trap.unTrap();

License:

MIT

Inspired from

https://www.youtube.com/watch?v=BoAsayPVogE