Wikipedia Summary Card On Hover – Hovercard.js

Category: Javascript , Recommended | August 16, 2019
Author: AnandChowdhary
Views Total: 485 views
Official Page: Go to website
Last Update: August 16, 2019
License: MIT


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 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-hovercard-title="United States">American

Possible options.

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


v2.0.1 (08/16/2019)

  • Use fetch endpoint function

v1.3.2 (02/06/2019)

  • Bugfix

v1.3.0 (12/30/2018)

  • Bugfix

You Might Be Interested In:

Leave a Reply