Css to group super buggy

I’m adding some CSS to a group to make it zoom in on hover. Which was working just fine before.

But now it sometimes work when first loading the page from the editor, but once the page is reloaded it stops working and strangely enough it also stops working when previewing again from the editor. And then randomly works again at some other random time, sometimes it starts to work 1-2 minutes after the page has been loaded, but wasn’t working when page was initially fully loaded.

I’ve tried it in a couple of apps and get the same result. I’m using the classify plug in
from @julienallard1 and this is the CSS I’m using.

<style>
.exampleClass {
}
</style>

<style>
.exampleClass:hover {
-ms-transform: scale(1.03); /* IE 9 */
-webkit-transform: scale(1.03); /* Safari 3-8 */
transform: scale(1.03); 
position: absolute;
  z-index: 1 !important;
}
</style>

anyone have any idea of what could be causing this behaviour?

Looks like a browser issue, Safari specifically. Ugh, I guess the answer was already in there.

Updated to a new one that works with newer safari and added animation to make it little sexier.
If anyone wants it,

<style>
.newClass {
}
.newClass:hover {
transition: transform .2s; /* Animation */
  transform: scale(1.5); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}
</style>
3 Likes

This topic was automatically closed after 70 days. New replies are no longer allowed.