Изградите приступачни модални Виндовс са дијалогом А11и

Модалс широко су подржани у модерним претраживачима. Могу се користити као попупс, као опт-ин поља, или чак за пхото слидесховс.

Ове прозоре можете направити користећи пуре ЦСС али ово није најприступачније решење. Уместо тога, погледајте А11и Диалог, потпуно функционалан модални прозор на који се фокусира прво приступачност.

Она ради ванилла ЈаваСцрипт са својим сопствени прилагођени АПИ и подржава све модерне претраживаче на свим уређајима. Можете погледати тхис демо да види како изгледа у акцији.

Изгледа као типичан модални прозор. Али, овај сценарио користи ознаке АРИА да подржи модерну приступачност за све кориснике.

Подразумевано је и А11и Диалог подржава екране осетљиве на додир, тако да тапкање има исти ефекат као и клик. Можете да кликнете или тапнете било где изван прозора да бисте га затворили или на рачунару притисните тастер ЕСЦ.

Некако, ова библиотека је прилично мала, онли 1.2кб, укључујући све ЦСС и ЈС кодове. То га чини лаким на врху потпуно приступачним.

Више можете научити читањем кроз ГитХуб репо и А11и Диалог има свој властиту страницу документације, такође. Ово укључује и поглавље о инсталација и подешавање за почетнике. Ту је и дугачка секција која покрива ДОМ АПИ за додавање тастера на вашу страницу која може отворити (или затворити) модални прозор.

Ако покушавате изградити приступачније веб странице озбиљно размислите о покретању А11и дијалога у вашим пројектима. Можете добити изворни код са ГитХуб-а или га преузмите из управитеља пакета као што је нпм или Бовер.

Погледајте главну страницу да бисте сазнали више о подешавању и основним функцијама ЈаваСцрипта. Ова библиотека долази много више од доступности АРИА-е, тако да је вредно тестирања ако желите да проширите функције ваших модалних прозора.