diff options
| author | Simon Podlipsky <[email protected]> | 2018-07-10 14:54:45 +0300 |
|---|---|---|
| committer | Simon Podlipsky <[email protected]> | 2018-07-10 14:54:45 +0300 |
| commit | 591725e8386c30b54e8aca258247c83811f628d8 (patch) | |
| tree | 1ffb7cb3076339837d2eedfbd896d1b05f726660 | |
| parent | abb48686267db3dadaa390e62538d23216c046d3 (diff) | |
| download | bootstrap-591725e8386c30b54e8aca258247c83811f628d8.tar.xz bootstrap-591725e8386c30b54e8aca258247c83811f628d8.zip | |
Document tooltip flickering in combination with some overflow settings
| -rw-r--r-- | docs/4.1/components/tooltips.md | 12 |
1 files changed, 12 insertions, 0 deletions
diff --git a/docs/4.1/components/tooltips.md b/docs/4.1/components/tooltips.md index 90bcc15ce..6e375feba 100644 --- a/docs/4.1/components/tooltips.md +++ b/docs/4.1/components/tooltips.md @@ -86,6 +86,18 @@ Trigger the tooltip via JavaScript: $('#example').tooltip(options) {% endhighlight %} +{% capture callout %} +##### Usage with overflow `auto` and `scroll` +When the parent container has CSS property `overflow` set to values `auto|scroll` (for example when used within `.table-responsive`) the tooltip has weird flickering behaviour. + +The solution is to set `boundary` option to anything other than default value `'scrollParent'`. Eg. set it to `'window'` + +{% highlight js %} +$('#example').tooltip({ boundary: 'window' }) +{% endhighlight %} +{% endcapture %} +{% include callout.html content=callout type="warning" %} + ### Markup The required markup for a tooltip is only a `data` attribute and `title` on the HTML element you wish to have a tooltip. The generated markup of a tooltip is rather simple, though it does require a position (by default, set to `top` by the plugin). |