More Premium Hugo Themes Premium Vue Themes

Vue Popper

:whale: VueJS popover component based popper.js

Vue Popper

:whale: VueJS popover component based popper.js

Author Avatar Theme by robinck
Github Stars Github Stars: 438
Last Commit Last Commit: Aug 16, 2021 -
First Commit Created: Aug 27, 2024 -
default image

Overview:

The vue-popperjs is a VueJS popover component that is based on popper.js. It provides a flexible and customizable solution for creating popovers in VueJS applications. With features like delay control, trigger options, and customizable classes, this component allows for easy integration and styling.

Features:

  • Disabled: Enable or disable the popover component.
  • Delay-on-mouse-over: Set a delay before showing the popover during a mouse-over event.
  • Append-to-body: Append the popover to the body instead of the parent element.
  • Visible-arrow: Show or hide the arrow on the popover.
  • Force-show: Force the popover to show regardless of trigger events.
  • Trigger: Define the event that triggers the popover, such as hover or click.
  • Content: Provide the content to be displayed within the popover.
  • Options: Customize popper.js options for positioning and behavior.

Installation:

To install the vue-popperjs component, you can use a CDN or package managers like NPM or Yarn.

CDN:

<script src="https://unpkg.com/vue-popperjs"></script>

NPM:

npm install vue-popperjs

Yarn:

yarn add vue-popperjs

Summary:

The vue-popperjs is a useful VueJS popover component that leverages the functionality of popper.js. With features like customizable delays, trigger options, and styling properties, it offers a convenient solution for implementing popovers in VueJS applications. Whether you need simple hover-triggered popovers or more complex interactions, vue-popperjs provides the flexibility and control required for a seamless user experience.