Jump to content

Guides

ips.ui.hovercard

Description

The hovercard widget can be used to display a popup with remote content, which is attached to a trigger element.

 

Example

@todo

 

Usage

The hovercard widget is initialized by including the widget key attribute on a link:

<a href='...' data-ipsHover>Hover on me</a>

The URL that the link points to is also the URL that is called to fetch the hovercard content, by default.

 

Options

target
(String; optional)

If a URL other than the link's href should be used to load the hovercard content, it can be specified in this option.

 

content
(Mixed; optional)

Sets the content of the hovercard. If a selector is provided, the contents of the matching element will be inserted into to hovercard. Alternatively, a string can be supplied which will be inserted into the hovercard. Using this option means remote content won't be loaded by the hovercard.

 

timeout
(Number; optional; default 0.75)

The number of seconds between the user hovering on the element and the hovercard beginning to load (and conversely, hiding when the mouse leaves the element).

 

attach
(Selector; optional)

The element that the hovercard will be attached to. If not specified, the element that the widget is initialized on will be used.

 

width
(Number; optional; default 300)

The width in pixels at which the hovercard will display.

 

onClick
(Boolean; optional; default false)

If true, the hovercard will be activated only when the user clicks on the element. By default, the hovercard will show on hover.

 

 


  Report Guide


×
×
  • Create New...

Important Information

We use technologies, such as cookies, to customise content and advertising, to provide social media features and to analyse traffic to the site. We also share information about your use of our site with our trusted social media, advertising and analytics partners. See more about cookies and our Privacy Policy