How do you keep the Hover rollover spot from scaling when the browser resizes?

Ask the community
1

How do you keep the Hover rollover spot from scaling when the browser resizes?

I am using the Hover Section from the Interactive Section. When the browser resizes, the hover rollover spot moves and is not fixed on the spot that I placed it. I would like the hover spots to be locked on the location I place them over the background image of the section. What use is the hover if it moves and will not stay with the thing it is being used to “explain” on rollover?

Where the hover position are placed in the Wix admin.
Where they show up on the live published site (image below)

error
error1000×937 158 KB

I am trying to get the rollover spot to be fixed because I am creating an interactive map that shows a description of the specific location that the user rolls the mouse cursor over.

I have tried all the settings I can find, including making the map image not scale. However, the location of the hover spot still scales even when I do this. Is there a setting that can force the hover spot and it’s rollover popup not move when the browser scales the window size?

Any ideas? I am sure it is simple and I just missed the setting somewhere. Thank you guys!

L

2

Any ideas? I still have not found a solution. Please take a look!

3

I’d suggest placing the image inside a container and then move all your hover triggers inside the same container. Then set the height and width of the container to a fixed px value and make sure that automatic scaling is turned off. Now the hover triggers are docked to the edge of this container, and when the browser window resizes and the section grows / shrinks, it should not move your hover triggers.

4

Thank you, I will try that. I thought I had done most of that, but I will look it over. Really appreciate it.

L

1 Like