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..5f29fba3 --- /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 #main div rather than the document body. + +[setAppElement example](https://codepen.io/neilhsmith/pen/JjmoaOV)