From 7473dc5ac70208d55204790751fdca75bd8b47d1 Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Mon, 22 Dec 2014 12:58:47 -0800 Subject: apply example tweaks from master branch --- javascript/index.html | 106 +++++++++++++++++++++++++++++++++++++------------- 1 file changed, 78 insertions(+), 28 deletions(-) (limited to 'javascript') diff --git a/javascript/index.html b/javascript/index.html index e3e5a0a5e..3a4d7abad 100644 --- a/javascript/index.html +++ b/javascript/index.html @@ -202,7 +202,10 @@

There are some caveats regarding using modals on mobile devices. See our browser support docs for details.

-

Due to how HTML5 defines its semantics, the autofocus HTML attribute has no effect in Bootstrap modals.

+

Due to how HTML5 defines its semantics, the autofocus HTML attribute has no effect in Bootstrap modals. To achieve the same effect, use some custom JavaScript:

+ 
$('#myModal').on('shown.bs.modal', function () {
+    $('#myInput').focus()
+  })

Examples

@@ -213,7 +216,7 @@
- +

Modal title

@@ -231,7 +234,7 @@ <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> - <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button> + <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <h4 class="modal-title">Modal title</h4> </div> <div class="modal-body"> @@ -253,7 +256,7 @@
- +
@@ -303,7 +306,7 @@ <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> - <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button> + <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <h4 class="modal-title" id="myModalLabel">Modal title</h4> </div> <div class="modal-body"> @@ -362,7 +365,7 @@
- +
@@ -376,7 +379,7 @@
- +
@@ -404,11 +407,11 @@
- +
-
+
@@ -436,11 +439,11 @@ <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> - <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button> + <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <h4 class="modal-title" id="exampleModalLabel">New message</h4> </div> <div class="modal-body"> - <form role="form"> + <form> <div class="form-group"> <label for="recipient-name" class="control-label">Recipient:</label> <input type="text" class="form-control" id="recipient-name"> @@ -591,7 +594,7 @@

Within a navbar

-