floating-vue
floating-vue copied to clipboard
Tooltip following the cursor
Is there an option to have the tooltip popup where the cursor is like the title
attribute does?
It would be nice to have this feature!
As v-tooltip is based on Popper.js, that would probably be something more Popper.js-related in my opinion.
Actually there has been done already some work on their side, but because of some issues (for example when scrolling on the page) they closed it for now (that was back in 2017 already): https://github.com/atomiks/tippyjs/issues/32
This could work. Below is a first quick draft, on how it's possible with Popper.js and v-tooltip. Adding a few config options and fine-tuning to limit it's movement to the selected component/element.
Progress: Now configurable for each component individually, which allows to have fixed and flexible items. Also plays along nicely with pre-defined Popper.js placement options (top, bottom,...)
#143 the PR is up, anyone who's interested or has suggestions is more than welcome to provide feedback! I'd love to hear your opinion
there is also a codepen showing popper following the mouse. This could be also play well with other targets to follow e.g. a range input knob or progress bar.
Thanks @joernroeder, that is actually the demo I took as a base for the PR
Would love this. Could be very nicely implemented like clubhouse has. By restricting it to the X-axis. And maybe the ability to restrict it to the Y-axis as well.
(My mouse is apparently not screen-captured)