-
Notifications
You must be signed in to change notification settings - Fork 6.7k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* docs(tooltip): add overview * add show/hide to overview
- Loading branch information
1 parent
81bcea1
commit 634bd0f
Showing
1 changed file
with
35 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,35 @@ | ||
The Angular Material tooltip provides a text label that is displayed with the user hovers | ||
over or longpresses an element. | ||
|
||
<!-- example(tooltip-overview) --> | ||
|
||
##Positioning | ||
|
||
The tooltip will be displayed below the element but this can be configured using the `mdTooltipPosition` | ||
input. | ||
The tooltip can be displayed above, below, left, or right of the element. By default the position | ||
will be below. If the tooltip should switch left/right positions in an RTL layout direction, then | ||
the positions `before` and `after` should be used instead of `left` and `right`, respectively. | ||
|
||
| Position | Description | | ||
|-----------|---------------------------------------------------------------------------------------| | ||
| `above` | Always display above the element | | ||
| `below ` | Always display beneath the element | | ||
| `left` | Always display to the left of the element | | ||
| `right` | Always display to the right of the element | | ||
| `before` | Display to the left in left-to-right layout and to the right in right-to-left layout | | ||
| `after` | Display to the right in left-to-right layout and to the right in right-to-left layout | | ||
|
||
|
||
##Show and Hide | ||
|
||
The tooltip is immediately shown when the user's mouse hovers over the element and immediately | ||
hides when the user's mouse leaves. A delay in showing or hiding the tooltip can be added through | ||
the inputs `mdTooltipShowDelay` and `mdTooltipHideDelay`. | ||
|
||
On mobile, the tooltip is displayed when the user longpresses the element and hides after a | ||
delay of 1500ms. | ||
|
||
The tooltip can also be shown and hidden through the `show` and `hide` directive methods, | ||
which both accept a number in milliseconds to delay before applying the display change. | ||
|