From: fat Date: Thu, 16 May 2013 19:50:06 +0000 (-0700) Subject: change dropdown strategy to use an overlay - fixes mobile click anywhere + allows... X-Git-Tag: v3.0.0-rc1~355 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=92245e8bc70f8d2e48036b7ba088551d07db29ca;p=thirdparty%2Fbootstrap.git change dropdown strategy to use an overlay - fixes mobile click anywhere + allows for firefox middle click --- diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css index 209aed4967..b9940b55e4 100644 --- a/docs/assets/css/bootstrap.css +++ b/docs/assets/css/bootstrap.css @@ -2799,6 +2799,15 @@ input[type="button"].btn-block { outline: 0; } +.dropdown-backdrop { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 990; +} + .pull-right > .dropdown-menu { right: 0; left: auto; diff --git a/docs/assets/js/bootstrap.js b/docs/assets/js/bootstrap.js index 62607d5884..77ed438b8e 100644 --- a/docs/assets/js/bootstrap.js +++ b/docs/assets/js/bootstrap.js @@ -471,132 +471,117 @@ * ============================================================ */ -!function ($) { - - "use strict"; // jshint ;_; - +!function ($) { "use strict"; - /* COLLAPSE PUBLIC CLASS DEFINITION - * ================================ */ + // COLLAPSE PUBLIC CLASS DEFINITION + // ================================ var Collapse = function (element, options) { - this.$element = $(element) - this.options = $.extend({}, $.fn.collapse.defaults, options) - - if (this.options.parent) { - this.$parent = $(this.options.parent) - } + this.$element = $(element) + this.options = $.extend({}, Collapse.DEFAULTS, options) + this.transitioning = null - this.options.toggle && this.toggle() + if (this.options.parent) this.$parent = $(this.options.parent) + if (this.options.toggle) this.toggle() } - Collapse.prototype = { + Collapse.DEFAULTS = { + toggle: true + } - constructor: Collapse + Collapse.prototype.dimension = function () { + var hasWidth = this.$element.hasClass('width') + return hasWidth ? 'width' : 'height' + } - , dimension: function () { - var hasWidth = this.$element.hasClass('width') - return hasWidth ? 'width' : 'height' - } + Collapse.prototype.show = function () { + if (this.transitioning || this.$element.hasClass('in')) return - , show: function () { - var dimension - , scroll - , actives - , hasData - - if (this.transitioning || this.$element.hasClass('in')) return - - dimension = this.dimension() - scroll = $.camelCase(['scroll', dimension].join('-')) - actives = this.$parent && this.$parent.find('> .accordion-group > .in') - - if (actives && actives.length) { - hasData = actives.data('collapse') - if (hasData && hasData.transitioning) return - actives.collapse('hide') - hasData || actives.data('collapse', null) - } + var dimension = this.dimension() + var scroll = $.camelCase(['scroll', dimension].join('-')) + var actives = this.$parent && this.$parent.find('> .accordion-group > .in') - this.$element[dimension](0) - this.transition('addClass', $.Event('show'), 'shown') - $.support.transition && this.$element[dimension](this.$element[0][scroll]) + if (actives && actives.length) { + var hasData = actives.data('collapse') + if (hasData && hasData.transitioning) return + actives.collapse('hide') + hasData || actives.data('collapse', null) } - , hide: function () { - var dimension - if (this.transitioning || !this.$element.hasClass('in')) return - dimension = this.dimension() - this.reset(this.$element[dimension]()) - this.transition('removeClass', $.Event('hide'), 'hidden') - this.$element[dimension](0) - } + this.$element[dimension](0) + this.transition('addClass', $.Event('show'), 'shown') - , reset: function (size) { - var dimension = this.dimension() + if ($.support.transition) this.$element[dimension](this.$element[0][scroll]) + } - this.$element - .removeClass('collapse') - [dimension](size || 'auto') - [0].offsetWidth + Collapse.prototype.hide = function () { + if (this.transitioning || !this.$element.hasClass('in')) return + var dimension = this.dimension() + this.reset(this.$element[dimension]()) + this.transition('removeClass', $.Event('hide'), 'hidden') + this.$element[dimension](0) + } - this.$element[size !== null ? 'addClass' : 'removeClass']('collapse') + Collapse.prototype.reset = function (size) { + var dimension = this.dimension() - return this - } + this.$element + .removeClass('collapse') + [dimension](size || 'auto') + [0].offsetWidth - , transition: function (method, startEvent, completeEvent) { - var that = this - , complete = function () { - if (startEvent.type == 'show') that.reset() - that.transitioning = 0 - that.$element.trigger(completeEvent) - } + this.$element[size !== null ? 'addClass' : 'removeClass']('collapse') - this.$element.trigger(startEvent) + return this + } - if (startEvent.isDefaultPrevented()) return + Collapse.prototype.transition = function (method, startEvent, completeEvent) { + var that = this + var complete = function () { + if (startEvent.type == 'show') that.reset() + that.transitioning = 0 + that.$element.trigger(completeEvent) + } - this.transitioning = 1 + this.$element.trigger(startEvent) - this.$element[method]('in') + if (startEvent.isDefaultPrevented()) return - $.support.transition && this.$element.hasClass('collapse') ? - this.$element.one($.support.transition.end, complete) : - complete() - } + this.transitioning = 1 - , toggle: function () { - this[this.$element.hasClass('in') ? 'hide' : 'show']() - } + this.$element[method]('in') + $.support.transition && this.$element.hasClass('collapse') ? + this.$element.one($.support.transition.end, complete) : + complete() } + Collapse.prototype.toggle = function () { + this[this.$element.hasClass('in') ? 'hide' : 'show']() + } - /* COLLAPSE PLUGIN DEFINITION - * ========================== */ + + // COLLAPSE PLUGIN DEFINITION + // ========================== var old = $.fn.collapse $.fn.collapse = function (option) { return this.each(function () { - var $this = $(this) - , data = $this.data('collapse') - , options = $.extend({}, $.fn.collapse.defaults, $this.data(), typeof option == 'object' && option) + var $this = $(this) + var data = $this.data('collapse') + var options = $.extend({}, Collapse.DEFAULTS, $this.data(), typeof option == 'object' && option) + if (!data) $this.data('collapse', (data = new Collapse(this, options))) if (typeof option == 'string') data[option]() }) } - $.fn.collapse.defaults = { - toggle: true - } - $.fn.collapse.Constructor = Collapse - /* COLLAPSE NO CONFLICT - * ==================== */ + // COLLAPSE NO CONFLICT + // ==================== $.fn.collapse.noConflict = function () { $.fn.collapse = old @@ -604,15 +589,16 @@ } - /* COLLAPSE DATA-API - * ================= */ + // COLLAPSE DATA-API + // ================= $(document).on('click.collapse.data-api', '[data-toggle=collapse]', function (e) { - var $this = $(this), href - , target = $this.attr('data-target') + var $this = $(this), href + var target = $this.attr('data-target') || e.preventDefault() || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') //strip for ie7 - , option = $(target).data('collapse') ? 'toggle' : $this.data() + var option = $(target).data('collapse') ? 'toggle' : $this.data() + $this[$(target).hasClass('in') ? 'addClass' : 'removeClass']('collapsed') $(target).collapse(option) }) @@ -638,123 +624,101 @@ * ============================================================ */ -!function ($) { - - "use strict"; // jshint ;_; - - - /* DROPDOWN CLASS DEFINITION - * ========================= */ - - 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 () { - $el.parent().removeClass('open') - }) - } - - Dropdown.prototype = { - - constructor: Dropdown +!function ($) { "use strict"; - , toggle: function (e) { - var $this = $(this) - , $parent - , isActive - if ($this.is('.disabled, :disabled')) return + // DROPDOWN CLASS DEFINITION + // ========================= - $parent = getParent($this) + var backdrop = '.dropdown-backdrop' + var toggle = '[data-toggle=dropdown]' + var Dropdown = function (element) { + var $el = $(element).on('click.dropdown.data-api', this.toggle) + $('html').on('click.dropdown.data-api', function () { + $el.parent().removeClass('open') + }) + } - isActive = $parent.hasClass('open') + Dropdown.prototype.toggle = function (e) { + var $this = $(this) - clearMenus() + if ($this.is('.disabled, :disabled')) return - if (!isActive) { - $parent.toggleClass('open') - } + var $parent = getParent($this) + var isActive = $parent.hasClass('open') - $this.focus() + clearMenus() - return false + if (!isActive) { + $('