diff --git a/docs/_includes/js/popovers.html b/docs/_includes/js/popovers.html
index dadddafc34..a782a12047 100644
--- a/docs/_includes/js/popovers.html
+++ b/docs/_includes/js/popovers.html
@@ -233,10 +233,11 @@ sagittis lacus vel augue laoreet rutrum faucibus.">
viewport |
- string | object |
+ string | object | function |
{ selector: 'body', padding: 0 } |
Keeps the popover within the bounds of this element. Example: viewport: '#viewport' or { "selector": "#viewport", "padding": 0 }
+ If a function is given, it is called with the triggering element DOM node as its only argument. The this context is set to the popover instance.
|
diff --git a/docs/_includes/js/tooltips.html b/docs/_includes/js/tooltips.html
index a8914b180e..5b399a5f38 100644
--- a/docs/_includes/js/tooltips.html
+++ b/docs/_includes/js/tooltips.html
@@ -199,10 +199,11 @@ $('#example').tooltip(options)
viewport |
- string | object |
+ string | object | function |
{ selector: 'body', padding: 0 } |
Keeps the tooltip within the bounds of this element. Example: viewport: '#viewport' or { "selector": "#viewport", "padding": 0 }
+ If a function is given, it is called with the triggering element DOM node as its only argument. The this context is set to the tooltip instance.
|
diff --git a/js/tests/unit/tooltip.js b/js/tests/unit/tooltip.js
index 8086631c89..0cb964e9b6 100644
--- a/js/tests/unit/tooltip.js
+++ b/js/tests/unit/tooltip.js
@@ -733,6 +733,37 @@ $(function () {
$styles.remove()
})
+ QUnit.test('should get viewport element from function', function (assert) {
+ assert.expect(3)
+ var styles = ''
+ var $styles = $(styles).appendTo('head')
+
+ var $container = $('').appendTo(document.body)
+ var $target = $('').appendTo($container)
+ $target
+ .bootstrapTooltip({
+ placement: 'bottom',
+ viewport: function ($element) {
+ assert.strictEqual($element[0], $target[0], 'viewport function was passed target as argument')
+ return ($element.closest('.container-viewport'))
+ }
+ })
+
+ $target.bootstrapTooltip('show')
+ var $tooltip = $container.find('.tooltip')
+ assert.strictEqual(Math.round($tooltip.offset().left), Math.round(60 + $container.width() - $tooltip[0].offsetWidth))
+
+ $target.bootstrapTooltip('hide')
+ assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
+
+ $container.remove()
+ $styles.remove()
+ })
+
QUnit.test('should not error when trying to show an auto-placed tooltip that has been removed from the dom', function (assert) {
assert.expect(1)
var passed = true
diff --git a/js/tooltip.js b/js/tooltip.js
index bbff2cdec8..b2d775938a 100644
--- a/js/tooltip.js
+++ b/js/tooltip.js
@@ -50,7 +50,7 @@
this.type = type
this.$element = $(element)
this.options = this.getOptions(options)
- this.$viewport = this.options.viewport && $(this.options.viewport.selector || this.options.viewport)
+ this.$viewport = this.options.viewport && $($.isFunction(this.options.viewport) ? this.options.viewport.call(this, this.$element) : (this.options.viewport.selector || this.options.viewport))
if (this.$element[0] instanceof document.constructor && !this.options.selector) {
throw new Error('`selector` option must be specified when initializing ' + this.type + ' on the window.document object!')