- Version
- 1.5.0
- License
- MIT
- Extends
- Popup
- Requires
- Popup
- Source
- Tooltip.js, line 14
Constructor
new Tooltip(options)
Creates a new tooltip instance.
| Name | Type | Description |
|---|---|---|
options |
tooltip~options |
Configuration options for the tooltip instance. |
Members
private aConf :Object<tooltip~options>
Holds the active configuration that applies to the current action.
- Type
- Object<tooltip~options>
- Source
- Tooltip.js, line 29
private iConf :Object<tooltip~options>
Holds the instance configuration for each instance.
- Type
- Object<tooltip~options>
- Source
- Tooltip.js, line 36
private els :Object
All references to DOM nodes are stored here.
| Name | Type | Description |
|---|---|---|
target
|
HTMLElement | The "target" of the Popup, ie the Element the Popup points to. Based on this Element, also the layout is calculated. |
root
|
HTMLElement | The root element of this widget (i.e. The outermost layer). |
pointer
|
HTMLElement | The pointer element. |
cnt
|
HTMLElement | The inner content element, which holds popup content injected later on. |
- Type
- Object
- Source
- Tooltip.js, line 49
private measurements :Object
Holds all relevant positioning values for calculating the layout.
| Name | Type | Description |
|---|---|---|
scrollTop
|
number | Scrolling posiiton from the top. |
scrollLeft
|
number | Scrolling posiiton from the left. |
viewportWidth
|
number | The width of the viewport in pixels. |
viewportHeight
|
number | Height of viewport in pixels. |
targetWidth
|
number | Width of target in pixels. |
targetHeight
|
number | Height of target in pixels. |
targetTop
|
number | Target top position in pixels. |
targetLeft
|
number | Target left position in pixels. |
popupWidth
|
number | Width of popup in pixels. |
popupHeight
|
number | Height of popup in pixels. |
pointerWidth
|
number | Width of pointer in pixels. |
pointerHeight
|
number | Height of pointer in pixels. |
- Type
- Object
- Source
- Tooltip.js, line 96
private layouts :Popup~layoutObject
Holds all calculated Layouts.
- Type
- Popup~layoutObject
- Source
- Tooltip.js, line 112
private handlers :Object<function()>
References to the various handlers, all bound (to "this").
| Name | Type | Description |
|---|---|---|
preventEvent
|
function | Handler for preventing (click) events. |
visible
|
function | Handler for the show transition event. |
move
|
function | Handler for mousemove event. |
hide
|
function | Handler for the hide event. |
hidden
|
function | Handler for the hide transition event. |
- Type
- Object<function()>
- Source
- Tooltip.js, line 124
private hasTransitions :boolean
Determines if the client has CSS transitions.
- Type
- boolean
- Source
- Tooltip.js, line 137
private transitionend :string
Determines which transition event name the client needs. Only useful for older Safaris.
- Type
- string
- Source
- Tooltip.js, line 144
private state :string
The current state of the tooltip.
- Type
- string
- Source
- Tooltip.js, line 159
private, static defaults :tooltip~options
Holds the defaults for all instances.
- Type
- tooltip~options
- Source
- Tooltip.js, line 615
Methods
show(content, event, optionsopt)
Shows the view.
| Name | Type | Attributes | Description |
|---|---|---|---|
content |
string | HTMLElement | DocumentFragment |
The content for the view. |
|
event |
Event | HTMLElement | DocumentFragment |
The originating event or element. |
|
options |
Popup~options | optional |
Additional options. |
- Source
- Tooltip.js, line 184
hide(eventopt, nullable)
Hides the view.
| Name | Type | Attributes | Description |
|---|---|---|---|
event |
Event | optional nullable |
The event that invoked the hide method. Not set if the widget is manually closed (in contrast to clicking on the background layer). |
- Source
- Tooltip.js, line 239
private showAfterDelay(content, event)
In essence, this is the equivalent to Popup#show, but in this case, the tooltip is (usually) shown with a small delay.
| Name | Type | Description |
|---|---|---|
content |
string | HTMLElement | DocumentFragment |
The content to show. |
event |
Event | HTMLElement | DocumentFragment |
The triggering event. |
- Source
- Tooltip.js, line 323
private onVisible()
Called when the tooltip is fully visible, usually after transitions have completed. Marks the state as 'visible' and finalizes any transition handling.
- Source
- Tooltip.js, line 388
layout(event)
Recalculates layout and positioning of the tooltip based on pointer or target.
| Name | Type | Description |
|---|---|---|
event |
Event |
The layout-triggering event. |
- Source
- Tooltip.js, line 410
private onHidden()
Finalizes hide transition, resets state and removes DOM.
- Source
- Tooltip.js, line 476
private onMove(event)
Handler for mousemove or touchmove. Moves the tooltip with the pointer and hides it if necessary.
| Name | Type | Description |
|---|---|---|
event |
Event |
The movement event. |
- Source
- Tooltip.js, line 503
detectLeftButton(event) → boolean
Detects if the left mouse button is currently pressed.
| Name | Type | Description |
|---|---|---|
event |
Event |
The pointer or mouse event. |
- Returns
-
True if left button is active.
- Type boolean
- Source
- Tooltip.js, line 558
private resetTimer()
Clears the delay timer if one is active.
- Source
- Tooltip.js, line 573
remove()
Cleans up DOM references and event listeners.
- Source
- Tooltip.js, line 585
static configure(options)
Configures the tooltip globally, so it must be called on the constructor: Tooltip.configure(...). Uses defaults for options that are not specified.
Unlike the instance method tooltip#configure, this applies to all future instances.
| Name | Type | Description |
|---|---|---|
options |
tooltip~options |
Global configuration object. |
- Source
- Tooltip.js, line 644