I’ve purchased a plugin to use with my site that almost does exactly what I need it to do.
Ideally, I could have a grid of icons that were about 50x50 in 4 rows and 4 columns and when I hovered over them a text box would appear to display information pertaining to each of them.
I’ve managed to accomplish something similar using the built-in Content Area Dropdown element that comes with Cornerstone. However, a click is required rather than a hover.
It can be seen in action at the bottom of this page https://miartisanlinkedinsf.com
I’ve got a page where I’m testing out the plugin version here: https://miartisan-linkedinsf.com/main-alt/
The issue is that the plugin doesn’t resize the hover text box based on the amount of text. Meaning that the only way to get a text box large enough to display all of the text is to increase the size of the original image.
In the example page, you can see the “Alcohol” icon is about the size I would like the images/icons to be. The rest are all much larger to accommodate the text that has to be displayed when you hover over the icons.
I realize the plugin isn’t provided by Cornerstone, but I’ve tried inspecting elements using Chrome Browser’s developer mode tools to write some custom CSS to address the icons and the resulting text box separately, I simply can’t figure out how to distinguish between them and size them independently.
I’ve also reached out to the plugin dev and he wants me to pay him to rewrite his plugin even though it actually doesn’t appear to be working as described.
Would anyone be willing to have a look at this and lend me some advice?
Thanks!
