This is the documentation for , which is no longer actively maintained.View latest version
A tooltip component that displays additional information when users hover over or click on an element. It supports different trigger modes and positioning options to provide contextual help or extra details.
Example
Loading...
<dy-tooltip .content=${"Tooltip text"} .unreachable=${true}>
<dy-button>Hover</dy-button>
</dy-tooltip>
<dy-tooltip
.content=${"Tooltip text"}
.position=${"topRight"}
.trigger=${"click"}>
<dy-button>Click</dy-button>
</dy-tooltip>
API
Extends DuoyunPopoverElement
| Property |
Type |
ghostStyle |
GhostStyle |
DuoyunPopoverElement
Shadow DOM; Extends GemElement
DuoyunPopoverElement Constructor DuoyunPopoverElement()
| Params |
Type |
options |
PopoverOptions |
DuoyunPopoverElement Static Properties
| Property |
Type |
ghostStyle |
GhostStyle |
DuoyunPopoverElement Static Methods
| Method |
Type |
open |
{ (e: Element, option: PopoverOptions): CloseCallback; (x: number, y: number, option: PopoverOptions): CloseCallback; (xywh: number[], option: PopoverOptions): CloseCallback; } |
DuoyunPopoverElement Instance Properties
| Property(Attribute) |
Reactive |
Type |
debug(debug) |
Yes |
boolean |
unreachable(unreachable) |
Yes |
boolean |
disabled(disabled) |
Yes |
boolean |
trigger(trigger) |
Yes |
'click' | 'hover' |
position(position) |
Yes |
Position | 'auto' |
content |
Yes |
string | TemplateResult |
ghostStyle |
Yes |
GhostStyle |
open |
|
Emitter<null> |
close |
|
Emitter<null> |
get popoverElement |
|
DuoyunPopoverGhostElement | undefined |
DuoyunPopoverElement Other
| Type |
Value |
| Event |
open, close |
| Part |
slot |
