Wikipedia Summary Card On Hover – Hovercard.js

Hovercard.js is a JavaScript library that attaches a Wikipedia Summary Card to terms within your article when hovering over.

How to use it:

Install and download the Hovercard.js package.

# Yarn
$ yarn add hovercard
# NPM
$ npm install hovercard --save

Import the Hovercard module into your project.

import Hovercard from "hovercard";

Initialize the Hovercard and we’re ready to go.

const cards = new Hovercard();

Add the required CSS class .hovercard to the target term.

<span class="hovercard">American</span>

Specify the link & title of the Wikipedia Summary Card.

<span class="hovercard" 
      data-link="https://google.com"
      data-hovercard-title="United States">American
</span>

Possible options.

const cards = new Hovercard({
      target: "_blank",
      lang: "en",
      link: "inherit",
      timeout: 50
});

Changelog:

v2.0.1 (08/16/2019)

• Use fetch endpoint function

v1.3.2 (02/06/2019)

• Bugfix

v1.3.0 (12/30/2018)

• Bugfix