{"id":13817288,"url":"https://github.com/hekigan/vue-directive-tooltip","last_synced_at":"2025-04-12T18:38:28.116Z","repository":{"id":19928896,"uuid":"88274365","full_name":"hekigan/vue-directive-tooltip","owner":"hekigan","description":"Vue.js tooltip directive. Easy to use, configure and style","archived":false,"fork":false,"pushed_at":"2023-01-07T06:48:31.000Z","size":4158,"stargazers_count":172,"open_issues_count":52,"forks_count":33,"subscribers_count":8,"default_branch":"master","last_synced_at":"2025-04-03T20:11:20.692Z","etag":null,"topics":["directive","tooltip","vue","vue2"],"latest_commit_sha":null,"homepage":"https://hekigan.github.io/vue-directive-tooltip/","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/hekigan.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-04-14T14:28:12.000Z","updated_at":"2025-01-18T13:03:12.000Z","dependencies_parsed_at":"2023-01-14T07:45:17.754Z","dependency_job_id":null,"html_url":"https://github.com/hekigan/vue-directive-tooltip","commit_stats":null,"previous_names":[],"tags_count":35,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hekigan%2Fvue-directive-tooltip","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hekigan%2Fvue-directive-tooltip/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hekigan%2Fvue-directive-tooltip/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hekigan%2Fvue-directive-tooltip/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/hekigan","download_url":"https://codeload.github.com/hekigan/vue-directive-tooltip/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248615941,"owners_count":21133981,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["directive","tooltip","vue","vue2"],"created_at":"2024-08-04T06:00:39.504Z","updated_at":"2025-04-12T18:38:28.080Z","avatar_url":"https://github.com/hekigan.png","language":"Vue","funding_links":[],"categories":["JavaScript","UI组件","Components \u0026 Libraries","UI Components [🔝](#readme)","UI Components"],"sub_categories":["提示","UI Components","Tooltip"],"readme":"# vue-directive-tooltip\n\n![Node](https://img.shields.io/node/v/vue-directive-tooltip.svg?style=flat-square)\n[![NPM](https://img.shields.io/npm/v/vue-directive-tooltip.svg?style=flat-square)](https://www.npmjs.com/package/vue-directive-tooltip)\n[![NPM Downloads/month](https://img.shields.io/npm/dm/vue-directive-tooltip.svg?style=flat-square)](https://www.npmjs.com/package/vue-directive-tooltip)\n[![Vue.js](https://img.shields.io/badge/vue-2-green.svg)](https://vuejs.org)\n\n\u003e Vue.js tooltip directive ([based on Popper.js](https://github.com/FezVrasta/popper.js))\n\n\n### Installation\n\n`yarn add vue-directive-tooltip`\n\nor\n\n`npm install vue-directive-tooltip --save`\n\n\n### Usage\n\nSuper simple\n\n```html\n\u003cspan v-tooltip=\"'my text'\"\u003esome text\u003c/span\u003e\n```\n\nA **lot of options** make this tooltip convenient:\n\n- **content**: simple text or use another html tag\n- **positioning** (right, left, ...)\n- **positioning variants**: start | end. ex: bottom.end, top.start, right.end, etc...\n- **delay** to hide (in ms)\n- **offset** (from the target in px)\n- choose from **several triggers** (hover, focus, click)\n- **full programmatic**, you choose when to show/hide the tooltip\n- and of course, use your **custom CSS** class\n\n\n### Documentation\n\n[Full documentation with examples](https://hekigan.github.io/vue-directive-tooltip/)\n\n[\u003cimg src=\"https://hekigan.github.io/vue-directive-tooltip/img/screenshot.jpg\"\u003e](https://hekigan.github.io/vue-directive-tooltip/)\n\n### Builds\n\nIf you don't use a package manager, you can [access `vue-directive-tooltip` via unpkg (CDN)](https://unpkg.com/vue-directive-tooltip/), download the source, or point your package manager to the url.\n\n`vue-directive-tooltip` is compiled as a collection of [CommonJS](http://webpack.github.io/docs/commonjs.html) modules \u0026 [ES2015 modules](http://www.2ality.com/2014/09/es6-modules-final.html) for bundlers that support the `jsnext:main` or `module` field in package.json (Rollup, Webpack 2)\n\nThe `vue-directive-tooltip` package includes precompiled production and development [UMD](https://github.com/umdjs/umd) builds in the [`dist` folder](https://unpkg.com/vue-directive-tooltip/dist/). They can be used directly without a bundler and are thus compatible with many popular JavaScript module loaders and environments. You can drop a UMD build as a [`\u003cscript\u003e` tag](https://unpkg.com/vue-directive-tooltip) on your page. The UMD builds make `vue-directive-tooltip` available as a `window.vueDirectiveTooltip` global variable.\n\n### License\n\nThe code is available under the [MIT](LICENSE) license.\n\n### Contributing\n\nWe are open to contributions, see [CONTRIBUTING.md](CONTRIBUTING.md) for more info.\n\n### Misc\n\nThis module was created using [generator-module-extended-boilerplate](https://github.com/hekigan/generator-module-extended-boilerplate).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhekigan%2Fvue-directive-tooltip","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhekigan%2Fvue-directive-tooltip","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhekigan%2Fvue-directive-tooltip/lists"}