Display Link/URL Preview On Hover – Hyperlinks

Preview:

Description:

Hyperlinks is a JavaScript library that fetches metadata (like Open Graph) from a website and displays a preview of that site when hovering over the link.

How to use it:

1. Import the necessary JavaScript and Stylesheet in the document.

<script src="https://cdn.jsdelivr.net/npm/@criticalcarpet/hyperlinks/dist/index.bundle.js" type="module" defer></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@criticalcarpet/hyperlinks/dist/main.css">

2. Add the hyperlinks class to the link and the library will take care of the rest. Note that the link needs to end with a slash (/).

<a href="https://github.com/microsoft/" class="hyperlinks">CSSScript</a>

Changelog:

01/08/2022

• minor fix, tooltip not working