Need help with vue-tippy?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

KABBOUCHI
401 Stars 48 Forks MIT License 302 Commits 7 Opened issues

Description

VueJS Tooltip powered by Tippy.js

Services available

!
?

Need anything else?

Contributors list

# 131,104
PHP
galaxy
Laravel
excel
264 commits
# 370,850
magento...
magento...
vuejs2
vuejs
2 commits
# 109,541
Vue.js
js
HTML
yarn
2 commits
# 31,403
Svelte
example...
q
visjs
2 commits
# 465,970
rxjs
CSS
HTML
Vue.js
2 commits
# 674,576
CSS
HTML
Vue.js
vuejs
1 commit
# 294,055
Shell
C++
Vue.js
vuejs
1 commit
# 597,931
CSS
HTML
Vue.js
vuejs
1 commit
# 418,819
Shell
Markdow...
vue-com...
Vue.js
1 commit
# 620,756
CSS
HTML
Vue.js
vuejs
1 commit
# 199,993
C#
Vue.js
vuejs
cpluspl...
1 commit
# 417,117
CSS
HTML
Vue.js
vuejs
1 commit
# 38,494
JavaScr...
HTML
Shell
inputma...
1 commit
# 175,662
steam
node
c-sharp
steam-a...
1 commit

VueTippy

npm vue2 download

Directive wrapper for Tippy.js


Documentation

For full v4 documentation, visit https://kabbouchi.github.io/vue-tippy/4.0/.

Installation

npm install --save vue-tippy
# or
yarn add vue-tippy

Usage

Bundler (Webpack, Rollup)

import Vue from "vue";
import VueTippy, { TippyComponent } from "vue-tippy";

Vue.use(VueTippy); Vue.component("tippy", TippyComponent);

// or Vue.use(VueTippy, { directive: "tippy", // => v-tippy flipDuration: 0, popperOptions: { modifiers: { preventOverflow: { enabled: false } } } }); Vue.component("tippy", TippyComponent);

// Add additional themes. import "tippy.js/themes/light.css"; import "tippy.js/themes/light-border.css"; import "tippy.js/themes/google.css"; import "tippy.js/themes/translucent.css";

Browser


Basic Usage

My Button!
My Button!

  My Button!

Using Vue component

  

Header

{{ message }} - data binding

Click

Tippy Trigger

  

Header

{{ message }} - data binding

Click
  

For full v4 documentation, visit https://kabbouchi.github.io/vue-tippy/4.0/.

For more info on TippyJS view the documentation and demo here: ~https://atomiks.github.io/tippyjs/~ https://kabbouchi.github.io/tippyjs-v4-docs/

License

MIT

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.