Rebuilding Hotspot Tooltips

Posted on 2016-11-25


Recently I have gotten some questions about upcoming updates for the Hotspots with Comments plugin. So I have decided to start a development blog to show what I’m currently working on. The plan is to post a new blog every Friday to show the progress being made. I’ll show specific features being worked at as well as a ‘behind the scenes’ look at development.

New Tooltips

One of the bigger issues right now with the plugin is that tooltips (the pop-ups that show when you mouse-over a hotspot) don’t always fit correctly in the browser screen, especially on mobile devices. Sometimes the tooltip is only partially shown and the rest falls off-screen because it is not positioned correctly.

Right now the plugin used the qTip2 library. Qtip2 doesn’t seem to get any updates and bug fixing is a drag. So I have decided to rebuild the tooltips code from scratch so I have 1): more control over how the tooltips look and behave and 2): reduce any dependency on external libraries.

So far the responsiveness has been greatly improved by it:


The new tooltips also allow for more customization. Instead of have a set number of styles, you can now change the text and background colors with the new editor:tooltip-editor

This does mean quite a rebuild in how the plugin works and stores the settings. As this means a significant rewrite anyway, I’m also improving the icons used for hotspots. More on this in the next devblog.