diff options
Diffstat (limited to 'docs')
| -rw-r--r-- | docs/_includes/js/modal.html | 14 |
1 files changed, 7 insertions, 7 deletions
diff --git a/docs/_includes/js/modal.html b/docs/_includes/js/modal.html index 840091f85..bdecb1eff 100644 --- a/docs/_includes/js/modal.html +++ b/docs/_includes/js/modal.html @@ -69,7 +69,7 @@ $('#myModal').on('shown.bs.modal', function () { <p>Toggle a modal via JavaScript by clicking the button below. It will slide down and fade in from the top of the page.</p> <!-- sample modal content --> <div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> - <div class="modal-dialog"> + <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> @@ -121,7 +121,7 @@ $('#myModal').on('shown.bs.modal', function () { <!-- Modal --> <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> - <div class="modal-dialog"> + <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> @@ -141,7 +141,7 @@ $('#myModal').on('shown.bs.modal', function () { <div class="bs-callout bs-callout-warning" id="callout-modal-accessibility"> <h4>Make modals accessible</h4> - <p>Be sure to add <code>role="dialog"</code> to <code>.modal</code>, <code>aria-labelledby="myModalLabel"</code> attribute to reference the modal title.</p> + <p>Be sure to add <code>role="dialog"</code> and <code>aria-labelledby="..."</code>, referencing the modal title, to <code>.modal</code>, and <code>role="document"</code> to the <code>.modal-dialog</code> itself.</p> <p>Additionally, you may give a description of your modal dialog with <code>aria-describedby</code> on <code>.modal</code>.</p> </div> @@ -222,7 +222,7 @@ $('#myModal').on('shown.bs.modal', function () { <p>To take advantage of the Bootstrap grid system within a modal, just nest <code>.container-fluid</code> within the <code>.modal-body</code> and then use the normal grid system classes within this container.</p> <!-- sample modal content --> <div id="gridSystemModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="gridModalLabel"> - <div class="modal-dialog"> + <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> @@ -270,7 +270,7 @@ $('#myModal').on('shown.bs.modal', function () { </div><!-- /example --> {% highlight html %} <div class="modal fade" role="dialog" aria-labelledby="gridSystemModalLabel"> - <div class="modal-dialog"> + <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> @@ -323,7 +323,7 @@ $('#myModal').on('shown.bs.modal', function () { ...more buttons... <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"> - <div class="modal-dialog"> + <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> @@ -356,7 +356,7 @@ $('#myModal').on('shown.bs.modal', function () { ...more buttons... <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"> - <div class="modal-dialog"> + <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> |