Skip to main content

keys

The keys configuration supplies default keyboard shortcuts for OpenKeyNav's modes and lets the application replace them with commands that fit its interaction design.

Configuration Option​

keys​

  • Type: Object
  • Description: An object to configure key bindings for different modes.

Default Key Bindings​

  • escape: 'q' - Alternative escape key for when the escape key is not easily accessible.
  • click: 'k' - Enter click mode to click on clickable elements, such as links.
  • scroll: 's' - Focus on the next scrollable region.
  • move: 'm' - Enter move mode for keyboard drag-and-drop interactions.
  • heading: 'h' - Focus on the next heading.

Customizing Key Bindings​

You can override the default key bindings by specifying a new key configuration.

Example​

Here's an example of how to customize the key bindings in OpenKeyNav:

const openKeyNav = new OpenKeyNav();

const config = {
    keys: {
        escape: 'e',   // Custom escape key
        click: 'c',    // Custom click mode key
        scroll: 'w',   // Custom scroll mode key
        move: 'd',     // Custom move mode key
        heading: 'n'   // Custom heading navigation key
    }
};

openKeyNav.init(config);

In this example, the default key bindings are overridden with custom keys. The escape key is changed to e, click mode to c, scroll mode to w, move mode to d, and heading navigation to n.

Summary​

  • Default Key Bindings:
    • escape: 'q'
    • click: 'k'
    • scroll: 's'
    • move: 'm'
    • heading: 'h'
  • Customizing Keys: You can override the default keys by providing a custom configuration in the keys object.

By using the keys configuration option, you can tailor OpenKeyNav's keyboard shortcuts to better fit your preferences and enhance the user experience on your website.