vue2-tooltip-simple v1.0.5

vue2-tooltip-simple

A lightweight, JS focused tooltip component for vue2.

Installing / Getting started

Getting started is dead simple.

npm install --save vue2-tooltip-simple

Inside your component or view:

import Tooltip from 'vue2-tooltip-simple'

After installing and importing the package into your component, it is very simple to use. Simply pass in the ID of the element you would like to mount the tooltip to, and pass in the element you would like to show inside the tooltip as a slot.

// inside your component
<template>
  <div>
    <Tooltip
      :elementId="'my-div'"
      :mode="'hover'"
      :classes="'warning'"
    >
      <template v-slot:content>
        <p>This is the text I want to show on hover</p>
      </template>
    </Tooltip>

    <div id="my-div">
      <p>This is the element I want the tooltip to show over when I hover!</p>
    </div>
  </div>
</template>

<script>
import Tooltip from 'vue2-tooltip-simple'
export default {
  ...
  components: {
    ...
    Tooltip,
    ...
  }
}
</script>

This would result in:

Options