Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Update tooltip docs to explain potential overflow boundary issue #26844

Merged
merged 4 commits into from Jul 20, 2018
Merged

Update tooltip docs to explain potential overflow boundary issue #26844

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
591725e
Document tooltip flickering in combination with some overflow settings
simPod Jul 10, 2018
e9ec13e
Update tooltips.md
XhmikosR Jul 10, 2018
da56d91
Reword
simPod Jul 12, 2018
a4b2e39
More wordsmithing
mdo Jul 16, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
11 changes: 11 additions & 0 deletions docs/4.1/components/tooltips.md
View file
Open in desktop
Expand Up @@ -86,6 +86,17 @@ Trigger the tooltip via JavaScript:
$('#example').tooltip(options)
{% endhighlight %}

{% capture callout %}
##### Overflow `auto` and `scroll`

Tooltip position attempts to automatically change when a parent container has `overflow: auto` or `overflow: scroll` like our `.table-responsive`, but still keeps the original placement's positioning. To resolve, set the `boundary` option to anything other than default value, `'scrollParent'`, such as `'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).
Expand Down