diff --git a/docs/javascript.html b/docs/javascript.html index 61b0c8dc02..9f153c0bf6 100644 --- a/docs/javascript.html +++ b/docs/javascript.html @@ -12,7 +12,7 @@ - + diff --git a/js/bootstrap-modal.js b/js/bootstrap-modal.js index 8b0ac2d02f..4201d843c2 100644 --- a/js/bootstrap-modal.js +++ b/js/bootstrap-modal.js @@ -85,11 +85,13 @@ .appendTo(document.body) .show() - setTimeout(function () { - that.$element - .addClass('in') - .trigger('shown') - }, 0) + if ($.support.transition && that.$element.hasClass('fade')) { + that.$backdrop[0].offsetWidth // force reflow + } + + that.$element + .addClass('in') + .trigger('shown') }) return this @@ -132,6 +134,8 @@ var that = this , animate = this.$element.hasClass('fade') ? 'fade' : '' if ( this.isShown && this.settings.backdrop ) { + var doAnimate = $.support.transition && animate + this.$backdrop = $('
') .appendTo(document.body) @@ -139,12 +143,15 @@ this.$backdrop.click($.proxy(this.hide, this)) } - setTimeout(function () { - that.$backdrop && that.$backdrop.addClass('in') - $.support.transition && that.$backdrop.hasClass('fade') ? - that.$backdrop.one(transitionEnd, callback) : - callback() - }, 0) + if ( doAnimate ) { + that.$backdrop[0].offsetWidth // force reflow + } + + that.$backdrop && that.$backdrop.addClass('in') + + doAnimate ? + that.$backdrop.one(transitionEnd, callback) : + callback() } else if ( !this.isShown && this.$backdrop ) { this.$backdrop.removeClass('in') @@ -165,13 +172,13 @@ function escape() { var that = this if ( this.isShown && this.settings.keyboard ) { - $('body').bind('keyup.modal', function ( e ) { + $(window).bind('keyup.modal', function ( e ) { if ( e.which == 27 ) { that.hide() } }) } else if ( !this.isShown ) { - $('body').unbind('keyup.modal') + $(window).unbind('keyup.modal') } } diff --git a/js/tests/unit/bootstrap-modal.js b/js/tests/unit/bootstrap-modal.js index be6babeef7..e96f678bea 100644 --- a/js/tests/unit/bootstrap-modal.js +++ b/js/tests/unit/bootstrap-modal.js @@ -1,151 +1,151 @@ $(function () { - module("bootstrap-modal") + module("bootstrap-modal") - test("should be defined on jquery object", function () { - var div = $("") - ok(div.modal, 'modal method is defined') - }) + test("should be defined on jquery object", function () { + var div = $("") + ok(div.modal, 'modal method is defined') + }) - test("should return element", function () { - var div = $("") - ok(div.modal() == div, 'document.body returned') - }) + test("should return element", function () { + var div = $("") + ok(div.modal() == div, 'div element returned') + }) - test("should expose defaults var for settings", function () { - ok($.fn.modal.defaults, 'default object exposed') - }) + test("should expose defaults var for settings", function () { + ok($.fn.modal.defaults, 'default object exposed') + }) - test("should insert into dom when show method is called", function () { - stop() - $.support.transition = false - var div = $("") - div - .modal() - .modal("show") - .bind("shown", function () { - ok($('#modal-test').length, 'modal insterted into dom') - start() - div.remove() - }) - }) + test("should insert into dom when show method is called", function () { + stop() + $.support.transition = false + var div = $("") + div + .modal() + .bind("shown", function () { + ok($('#modal-test').length, 'modal insterted into dom') + start() + div.remove() + }) + .modal("show") + }) - test("should hide modal when hide is called", function () { - stop() - $.support.transition = false - var div = $("") - div - .modal() - .bind("shown", function () { - ok($('#modal-test').is(":visible"), 'modal visible') - ok($('#modal-test').length, 'modal insterted into dom') - div.modal("hide") - }) - .bind("hidden", function() { - ok(!$('#modal-test').is(":visible"), 'modal hidden') - start() - div.remove() - }) - .modal("show") - }) + test("should hide modal when hide is called", function () { + stop() + $.support.transition = false + var div = $("") + div + .modal() + .bind("shown", function () { + ok($('#modal-test').is(":visible"), 'modal visible') + ok($('#modal-test').length, 'modal insterted into dom') + div.modal("hide") + }) + .bind("hidden", function() { + ok(!$('#modal-test').is(":visible"), 'modal hidden') + start() + div.remove() + }) + .modal("show") + }) - test("should toggle when toggle is called", function () { - stop() - $.support.transition = false - var div = $("") - div - .modal() - .bind("shown", function () { - ok($('#modal-test').is(":visible"), 'modal visible') - ok($('#modal-test').length, 'modal insterted into dom') - div.modal("toggle") - }) - .bind("hidden", function() { - ok(!$('#modal-test').is(":visible"), 'modal hidden') - start() - div.remove() - }) - .modal("toggle") - }) + test("should toggle when toggle is called", function () { + stop() + $.support.transition = false + var div = $("") + div + .modal() + .bind("shown", function () { + ok($('#modal-test').is(":visible"), 'modal visible') + ok($('#modal-test').length, 'modal insterted into dom') + div.modal("toggle") + }) + .bind("hidden", function() { + ok(!$('#modal-test').is(":visible"), 'modal hidden') + start() + div.remove() + }) + .modal("toggle") + }) - test("should remove from dom when click .close", function () { - stop() - $.support.transition = false - var div = $("