diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css index bb40c85f7d..0bd063ee72 100644 --- a/docs/assets/css/bootstrap.css +++ b/docs/assets/css/bootstrap.css @@ -2384,12 +2384,17 @@ table .span24 { margin-left: 2px; } -.dropdown:hover .caret, +.dropdown a:focus .caret, +.dropdown a:hover .caret, .open .caret { opacity: 1; filter: alpha(opacity=100); } +.navbar .nav .open > a { + color: #ffffff; +} + .dropdown-menu { position: absolute; top: 100%; @@ -2443,11 +2448,13 @@ table .span24 { } .dropdown-menu li > a:hover, +.dropdown-menu li > a:focus, .dropdown-menu .active > a, .dropdown-menu .active > a:hover { color: #ffffff; text-decoration: none; background-color: #0088cc; + outline: 0; } .open { @@ -3810,6 +3817,7 @@ input[type="submit"].btn.btn-mini { margin: 0; } +.navbar .nav > li > a:focus, .navbar .nav > li > a:hover { color: #ffffff; text-decoration: none; @@ -3817,7 +3825,8 @@ input[type="submit"].btn.btn-mini { } .navbar .nav .active > a, -.navbar .nav .active > a:hover { +.navbar .nav .active > a:hover, +.navbar .nav .active > a:focus { color: #ffffff; text-decoration: none; background-color: #222222; @@ -3947,6 +3956,7 @@ input[type="submit"].btn.btn-mini { background-color: transparent; } +.navbar .nav li.dropdown.active > .dropdown-toggle:focus, .navbar .nav li.dropdown.active > .dropdown-toggle:hover { color: #ffffff; } diff --git a/docs/assets/js/bootstrap-dropdown.js b/docs/assets/js/bootstrap-dropdown.js index 454a9684b5..d71a54292d 100644 --- a/docs/assets/js/bootstrap-dropdown.js +++ b/docs/assets/js/bootstrap-dropdown.js @@ -26,7 +26,7 @@ /* DROPDOWN CLASS DEFINITION * ========================= */ - var toggle = '[data-toggle="dropdown"]' + var toggle = '[data-toggle=dropdown]' , Dropdown = function (element) { var $el = $(element).on('click.dropdown.data-api', this.toggle) $('html').on('click.dropdown.data-api', function () { @@ -41,34 +41,82 @@ , toggle: function (e) { var $this = $(this) , $parent - , selector , isActive if ($this.is('.disabled, :disabled')) return - selector = $this.attr('data-target') - - if (!selector) { - selector = $this.attr('href') - selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7 - } - - $parent = $(selector) - $parent.length || ($parent = $this.parent()) + $parent = getParent($this) isActive = $parent.hasClass('open') clearMenus() - if (!isActive) $parent.toggleClass('open') + if (!isActive) { + $parent.toggleClass('open') + $this.focus() + } return false } + , keydown: function (e) { + var $this + , $items + , $active + , $parent + , isActive + , index + + if (!/(38|40|27)/.test(e.keyCode)) return + + $this = $(this) + + e.preventDefault() + e.stopPropagation() + + if ($this.is('.disabled, :disabled')) return + + $parent = getParent($this) + + isActive = $parent.hasClass('open') + + if (!isActive || (isActive && e.keyCode == 27)) return $this.click() + + $items = $('[role=menu] li:not(.divider) a', $parent) + + if (!$items.length) return + + index = $items.index($items.filter(':focus')) + + if (e.keyCode == 38 && index > 0) index-- // up + if (e.keyCode == 40 && index < $items.length - 1) index++ // down + if (!~index) index = 0 + + $items + .eq(index) + .focus() + } + } function clearMenus() { - $(toggle).parent().removeClass('open') + getParent($(toggle)) + .removeClass('open') + } + + function getParent($this) { + var selector = $this.attr('data-target') + , $parent + + if (!selector) { + selector = $this.attr('href') + selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7 + } + + $parent = $(selector) + $parent.length || ($parent = $this.parent()) + + return $parent } @@ -91,10 +139,12 @@ * =================================== */ $(function () { - $('html').on('click.dropdown.data-api', clearMenus) + $('html') + .on('click.dropdown.data-api', clearMenus) $('body') .on('click.dropdown', '.dropdown form', function (e) { e.stopPropagation() }) - .on('click.dropdown.data-api', toggle, Dropdown.prototype.toggle) + .on('click.dropdown.data-api' , toggle, Dropdown.prototype.toggle) + .on('keydown.dropdown.data-api', toggle + ', [role=menu]' , Dropdown.prototype.keydown) }) }(window.jQuery); \ No newline at end of file diff --git a/docs/assets/js/bootstrap-modal.js b/docs/assets/js/bootstrap-modal.js index 38fd0c8468..fb5da75c3a 100644 --- a/docs/assets/js/bootstrap-modal.js +++ b/docs/assets/js/bootstrap-modal.js @@ -52,8 +52,9 @@ this.isShown = true - escape.call(this) - backdrop.call(this, function () { + this.escape() + + this.backdrop(function () { var transition = $.support.transition && that.$element.hasClass('fade') if (!that.$element.parent().length) { @@ -69,6 +70,8 @@ that.$element.addClass('in') + that.enforceFocus() + transition ? that.$element.one($.support.transition.end, function () { that.$element.trigger('shown') }) : that.$element.trigger('shown') @@ -91,90 +94,96 @@ $('body').removeClass('modal-open') - escape.call(this) + this.escape() + + $(document).off('focusin.modal') this.$element.removeClass('in') $.support.transition && this.$element.hasClass('fade') ? - hideWithTransition.call(this) : - hideModal.call(this) + this.hideWithTransition() : + this.hideModal() } - } - - - /* MODAL PRIVATE METHODS - * ===================== */ - - function hideWithTransition() { - var that = this - , timeout = setTimeout(function () { - that.$element.off($.support.transition.end) - hideModal.call(that) - }, 500) - - this.$element.one($.support.transition.end, function () { - clearTimeout(timeout) - hideModal.call(that) - }) - } - - function hideModal(that) { - this.$element - .hide() - .trigger('hidden') - - backdrop.call(this) - } - - function backdrop(callback) { - var that = this - , animate = this.$element.hasClass('fade') ? 'fade' : '' - - if (this.isShown && this.options.backdrop) { - var doAnimate = $.support.transition && animate - - this.$backdrop = $('