The only GIF tooltip plugin you need

🌟 Easy to use 🌟

🌈 Only 4kb 💓 Star


By default, Toolgif takes your text as tag and find gifs on Giphy.

Lorem ipsum dolor cat amet.

<p>Lorem ipsum dolor <span class="my-class">cat</span> amet.<p>
new Toolgif(".my-class").toolgif();
Codepen Demo external-link

Custom Gifs

You can add your own gif by adding "data-toolgif-url" in your html.

Don't use drugs.

<p>Don't use<span class="my-class" data-toolgif-url="">drugs</span>.</p>
Codepen Demo external-link

Custom Tags

You can easily set specific tag.

Do you wear glasses?

<p>Do you wear <span class="my-class" data-toolgif-tag="deal-with-it">glasses</span>?</p>
Codepen Demo external-link

Default Options

These are default options. You can easily play with them.

new Toolgif(".my-class", {
	width: 120,
	height: 100,
	borderRadius: 5,
	placement: "top",
	downsized: true, // File size under 2mb (see
	preloader: // data url here(it's kinda long as you expect so i didn't put here)