Library

/

Overlay

/

Hover Card

The hover_card.root contains all the parts of a hover card.

The hover_card.trigger wraps the link that will open the hover card.

The hover_card.content contains the content of the open hover card.

Hover over the text to see the tooltip. Hover over me

The on_open_change event is called when the open state of the hovercard changes. It is used in conjunction with the open prop, which is passed to the event handler.

Number of times hovercard opened or closed: 0

Hovercard open: false

Hover over the text to see the hover card. Hover over me

API Reference

rx.hover_card.root

For sighted users to preview content available behind a link.

Hover over me

Prop	Type \| Values	Default	Interactive
`default_open`	`bool`
`open`	`bool`
`open_delay`	`int`
`close_delay`	`int`

Event Triggers

See the full list of default event triggers

Trigger	Description
`on_open_change`	Fired when the open state changes.

rx.hover_card.content

Contains the content of the open hover card.

Hover over me

Prop	Type \| Values	Interactive
`side`	`"top" \| "right" \| ...`
`side_offset`	`int`
`align`	`"start" \| "center" \| ...`
`align_offset`	`int`
`avoid_collisions`	`bool`	false
`collision_padding`	`Union[float, int, dict]`
`sticky`	`"partial" \| "always"`
`hide_when_detached`	`bool`	false
`size`	`"1" \| "2" \| ...`