Icon Box type (Animated) mouse-over animation

[Jonathan]

Hey, I’m curious what causes the “Animated” type of Icon Box to do different mouse-over animations? I have noticed that the Icon Box will animated differently sometimes.

For example, they simply change content on mouse-over in your demo page here: http://swiftideas.com/elements/icon-box/ (at the bottom).
While on my site they do a little “flip” animation like the Icon Box is flipping over/turning around. They didn’t always do this, and I have noticed this before… perhaps it is a browser-related thing? However I am noticing the issue within the same browser.. strange.

Ultimately, I would prefer to have the simple content-change animation on mouse-over – rather than the “flip/rotate” animation. Thanks!

[David Martin – Support]

Hi,

If you edit the icon box within the Page Builder, you can change animation to a different effect. Have you tried that ?

Thanks.

[Jonathan]

Hey David, thanks for the reply,

Where in the Edit window of the Icon Box would I go to change the animation effect? I don’t see any option for that.
Just to clarify, this animated effect is different from the normal “Intro Animation” for how the element loads into the viewport. (That’s the only “Animation” option I see)

Thanks

[Kyle – SUPPORT]

Hi

The boxes are supposed to flip, just seems to be broken on the demo

Do you want to remove this functionality? If so please provide me with your link

– Kyle

[Jonathan]

This reply has been marked as private.

[Kyle – SUPPORT]

No I can’t see any login details, please provide via private reply

– Kyle

[Jonathan]

This reply has been marked as private.

[David Martin – Support]

Hi,

Rather than the flip functionality, what are you looking for it to do? – I have logged in but you are editing the page currently, please come out.

Thanks.

[David Martin – Support]

Ex: you can change “Icon Box Type” from Animation to “Standard” to remove the flip?

Thanks.

[Jonathan]

Ok, don’t worry about it – was just trying to use the “Animated” Icon Box style, but without the “flip/rotating” animation on mouse-over. But it’s no big deal, as it looks like some custom stuff is required.

I appreciate the help and clarification, guys.

[Kyle – SUPPORT]

No need, just add this to your custom css:

.sf-icon-box-animated .front, .sf-icon-box-animated .back {
  transition: none;
}

– Kyle