Wikipedia Summary Card On Hover – Hovercard.js

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

Preview:

Wikipedia Summary Card On Hover – Hovercard.js

Description:

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

You Might Be Interested In:


Leave a Reply