Skip to content

B
bootstrap
Commit e2d4cf5f authored by fat's avatar fat
Browse files
Options

change how collapse works - collapse, collapsing, and in

parent 178d8e98
Expand all Show whitespace changes
Inline Side-by-side
Showing with 102 additions and 74 deletions
assets/js/application.js
View file @ e2d4cf5f
...@@ -15,13 +15,11 @@ ...@@ -15,13 +15,11 @@
offset: navHeight offset: navHeight
}) })
// Disable certain links in docs $('[href^=#]').click(function (e) {
$('.bs-docs-container [href=#]').click(function (e) {
e.preventDefault() e.preventDefault()
}) })
$(document.body).on('click', '[href^=#]', function (e) { $(document.body).on('click', '.bs-sidenav [href^=#]', function (e) {
var $target = $(this.getAttribute('href')) var $target = $(this.getAttribute('href'))
e.preventDefault() // prevent browser scroll e.preventDefault() // prevent browser scroll
......
dist/css/bootstrap.css
View file @ e2d4cf5f
...@@ -2016,6 +2016,14 @@ input[type="button"].btn-block { ...@@ -2016,6 +2016,14 @@ input[type="button"].btn-block {
} }
.collapse { .collapse {
display: none;
}
.collapse.in {
display: block;
}
.collapsing {
position: relative; position: relative;
height: 0; height: 0;
overflow: hidden; overflow: hidden;
...@@ -2023,10 +2031,6 @@ input[type="button"].btn-block { ...@@ -2023,10 +2031,6 @@ input[type="button"].btn-block {
transition: height 0.35s ease; transition: height 0.35s ease;
} }
.collapse.in {
height: auto;
}
.caret { .caret {
display: inline-block; display: inline-block;
width: 0; width: 0;
......
dist/css/bootstrap.min.css
View file @ e2d4cf5f
This source diff could not be displayed because it is too large. You can view the blob instead.
dist/js/bootstrap.js
View file @ e2d4cf5f
...@@ -53,6 +53,7 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") } ...@@ -53,6 +53,7 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
$(this).one('webkitTransitionEnd', function () { called = true }) $(this).one('webkitTransitionEnd', function () { called = true })
var callback = function () { if (!called) $($el).trigger('webkitTransitionEnd') } var callback = function () { if (!called) $($el).trigger('webkitTransitionEnd') }
setTimeout(callback, duration) setTimeout(callback, duration)
return this
} }
$(function () { $(function () {
...@@ -532,8 +533,6 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") } ...@@ -532,8 +533,6 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
this.$element.trigger(startEvent) this.$element.trigger(startEvent)
if (startEvent.isDefaultPrevented()) return if (startEvent.isDefaultPrevented()) return
var dimension = this.dimension()
var scroll = $.camelCase(['scroll', dimension].join('-'))
var actives = this.$parent && this.$parent.find('> .accordion-group > .in') var actives = this.$parent && this.$parent.find('> .accordion-group > .in')
if (actives && actives.length) { if (actives && actives.length) {
...@@ -543,10 +542,32 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") } ...@@ -543,10 +542,32 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
hasData || actives.data('bs.collapse', null) hasData || actives.data('bs.collapse', null)
} }
this.$element[dimension](0) var dimension = this.dimension()
this.transition('addClass', 'shown.bs.collapse')
this.$element
.removeClass('collapse')
.addClass('collapsing')
[dimension](0)
this.transitioning = 1
var complete = function () {
this.$element
.removeClass('collapsing')
.addClass('in')
[dimension]('auto')
this.transitioning = 0
this.$element.trigger('shown.bs.collapse')
}
if (!$.support.transition) return complete.call(this)
if ($.support.transition) this.$element[dimension](this.$element[0][scroll]) var scrollSize = $.camelCase(['scroll', dimension].join('-'))
this.$element
.one($.support.transition.end, $.proxy(complete, this))
.emulateTransitionEnd(350)
[dimension](this.$element[0][scrollSize])
} }
Collapse.prototype.hide = function () { Collapse.prototype.hide = function () {
...@@ -557,41 +578,32 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") } ...@@ -557,41 +578,32 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
if (startEvent.isDefaultPrevented()) return if (startEvent.isDefaultPrevented()) return
var dimension = this.dimension() var dimension = this.dimension()
this.reset(this.$element[dimension]())
this.transition('removeClass', 'hidden.bs.collapse')
this.$element[dimension](0)
}
Collapse.prototype.reset = function (size) { this.$element
var dimension = this.dimension() [dimension](this.$element[dimension]())
[0].offsetHeight
this.$element this.$element
.addClass('collapsing')
.removeClass('collapse') .removeClass('collapse')
[dimension](size || 'auto') .removeClass('in')
[0].offsetWidth
this.$element[size != null ? 'addClass' : 'removeClass']('collapse')
return this this.transitioning = 1
}
Collapse.prototype.transition = function (method, completeEvent) {
var that = this
var complete = function () { var complete = function () {
if (completeEvent == 'shown.bs.collapse') that.reset() this.transitioning = 0
that.transitioning = 0 this.$element
that.$element.trigger(completeEvent) .trigger('hidden.bs.collapse')
.removeClass('collapsing')
.addClass('collapse')
} }
this.transitioning = 1 if (!$.support.transition) return complete.call(this)
this.$element[method]('in')
$.support.transition && this.$element.hasClass('collapse') ?
this.$element this.$element
.one($.support.transition.end, complete) [dimension](0)
.emulateTransitionEnd(350) : .one($.support.transition.end, $.proxy(complete, this))
complete() .emulateTransitionEnd(350)
} }
Collapse.prototype.toggle = function () { Collapse.prototype.toggle = function () {
......
dist/js/bootstrap.min.js
View file @ e2d4cf5f
This diff is collapsed.
js/collapse.js
View file @ e2d4cf5f
...@@ -48,8 +48,6 @@ ...@@ -48,8 +48,6 @@
this.$element.trigger(startEvent) this.$element.trigger(startEvent)
if (startEvent.isDefaultPrevented()) return if (startEvent.isDefaultPrevented()) return
var dimension = this.dimension()
var scroll = $.camelCase(['scroll', dimension].join('-'))
var actives = this.$parent && this.$parent.find('> .accordion-group > .in') var actives = this.$parent && this.$parent.find('> .accordion-group > .in')
if (actives && actives.length) { if (actives && actives.length) {
...@@ -59,10 +57,32 @@ ...@@ -59,10 +57,32 @@
hasData || actives.data('bs.collapse', null) hasData || actives.data('bs.collapse', null)
} }
this.$element[dimension](0) var dimension = this.dimension()
this.transition('addClass', 'shown.bs.collapse')
this.$element
.removeClass('collapse')
.addClass('collapsing')
[dimension](0)
this.transitioning = 1
var complete = function () {
this.$element
.removeClass('collapsing')
.addClass('in')
[dimension]('auto')
this.transitioning = 0
this.$element.trigger('shown.bs.collapse')
}
if (!$.support.transition) return complete.call(this)
if ($.support.transition) this.$element[dimension](this.$element[0][scroll]) var scrollSize = $.camelCase(['scroll', dimension].join('-'))
this.$element
.one($.support.transition.end, $.proxy(complete, this))
.emulateTransitionEnd(350)
[dimension](this.$element[0][scrollSize])
} }
Collapse.prototype.hide = function () { Collapse.prototype.hide = function () {
...@@ -73,41 +93,32 @@ ...@@ -73,41 +93,32 @@
if (startEvent.isDefaultPrevented()) return if (startEvent.isDefaultPrevented()) return
var dimension = this.dimension() var dimension = this.dimension()
this.reset(this.$element[dimension]())
this.transition('removeClass', 'hidden.bs.collapse')
this.$element[dimension](0)
}
Collapse.prototype.reset = function (size) { this.$element
var dimension = this.dimension() [dimension](this.$element[dimension]())
[0].offsetHeight
this.$element this.$element
.addClass('collapsing')
.removeClass('collapse') .removeClass('collapse')
[dimension](size || 'auto') .removeClass('in')
[0].offsetWidth
this.$element[size != null ? 'addClass' : 'removeClass']('collapse')
return this this.transitioning = 1
}
Collapse.prototype.transition = function (method, completeEvent) {
var that = this
var complete = function () { var complete = function () {
if (completeEvent == 'shown.bs.collapse') that.reset() this.transitioning = 0
that.transitioning = 0 this.$element
that.$element.trigger(completeEvent) .trigger('hidden.bs.collapse')
.removeClass('collapsing')
.addClass('collapse')
} }
this.transitioning = 1 if (!$.support.transition) return complete.call(this)
this.$element[method]('in')
$.support.transition && this.$element.hasClass('collapse') ?
this.$element this.$element
.one($.support.transition.end, complete) [dimension](0)
.emulateTransitionEnd(350) : .one($.support.transition.end, $.proxy(complete, this))
complete() .emulateTransitionEnd(350)
} }
Collapse.prototype.toggle = function () { Collapse.prototype.toggle = function () {
......
js/transition.js
View file @ e2d4cf5f
...@@ -46,6 +46,7 @@ ...@@ -46,6 +46,7 @@
$(this).one('webkitTransitionEnd', function () { called = true }) $(this).one('webkitTransitionEnd', function () { called = true })
var callback = function () { if (!called) $($el).trigger('webkitTransitionEnd') } var callback = function () { if (!called) $($el).trigger('webkitTransitionEnd') }
setTimeout(callback, duration) setTimeout(callback, duration)
return this
} }
$(function () { $(function () {
......
less/component-animations.less
View file @ e2d4cf5f
...@@ -16,12 +16,14 @@ ...@@ -16,12 +16,14 @@
} }
.collapse { .collapse {
display: none;
&.in {
display: block;
}
}
.collapsing {
position: relative; position: relative;
height: 0; height: 0;
overflow: hidden; overflow: hidden;
.transition(height .35s ease); .transition(height .35s ease);
&.in {
height: auto;
}
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment