From c47c1a29d598bf9e77906078bbaf3178fc0f1619 Mon Sep 17 00:00:00 2001 From: Neil Smith Date: Sat, 8 Apr 2023 18:58:32 -0500 Subject: [PATCH] [chore] readd setAppElement example --- README.md | 1 + docs/examples/set_app_element.md | 7 +++++++ 2 files changed, 8 insertions(+) create mode 100644 docs/examples/set_app_element.md diff --git a/README.md b/README.md index ab69848f..2a128a4c 100644 --- a/README.md +++ b/README.md @@ -123,6 +123,7 @@ There are several demos hosted on [CodePen](https://codepen.io) which demonstrate various features of react-modal: * [Minimal example](https://codepen.io/neilhsmith/pen/QWVVEEg) +* [Using setAppElement](https://codepen.io/neilhsmith/pen/JjmoaOV) * [Using onRequestClose](https://codepen.io/neilhsmith/pen/OJooXBg) * [Using shouldCloseOnOverlayClick](https://codepen.io/neilhsmith/pen/wvEYxKa) * [Using inline styles](https://codepen.io/neilhsmith/pen/gOdZPPP) diff --git a/docs/examples/set_app_element.md b/docs/examples/set_app_element.md new file mode 100644 index 00000000..c239254f --- /dev/null +++ b/docs/examples/set_app_element.md @@ -0,0 +1,7 @@ +# Using setAppElement + +This example shows how to use setAppElement to properly hide your application from screenreaders and other assistive technologies while the modal is open. + +You'll notice in this example that the aria-hidden attribute is applied to the #root div rather than the document body. + +[setAppElement example](https://codepen.io/neilhsmith/pen/JjmoaOV)