Skip to content

A small dependency-free script for making `pre` elements keyboard-accessible

Notifications You must be signed in to change notification settings

MichaelAllenWarner/keyboard-accessible-pre

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 

Repository files navigation

Keyboard-Accessible Pre: A Small, Dependency-Free Script for Making <pre> Elements Keyboard-Accessible

Because text in a <pre> doesn't wrap (unless you use something like white-space: pre-wrap), keyboard-users generally have no means of reading content that overflows the element (except in Firefox).

This little script uses a ResizeObserver to set and maintain the tabindex of all <pre> elements on the page, making each of them keyboard-focusable when it has overflow and not keyboard-focusable when it doesn't. When a <pre> is focusable, it also has generic role and aria-label attributes for the benefit of those using a screen-reader (role="group" and aria-label="Preformatted text that overflows visually").

About

A small dependency-free script for making `pre` elements keyboard-accessible

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published