Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
Nexal

animation doesn't work proprerty on Ipad and Iphone

Recommended Posts

 

hi, I'm having problems with gsap animation on ios (phone, tablet) when I have a certain number of animations on the same page. to fix the problem I added to the elements that caused the problem 'will-change: transform;' and now it works, but if you look on codepen you will see that the quality of the element is lost and becomes very large. how can i solve?

 

 

on codepen I have inserted only the code necessary to visualize the animation that creates problems.

See the Pen Oeqzyo by damiano31 (@damiano31) on CodePen

Link to comment
Share on other sites

Hello @Nexal and Welcome to the GreenSock Forum!

 

When you say:

 

1 hour ago, Nexal said:

I have a certain number of animations on the same page

 

Do you mean the CSS animations that are on your page in the HTML panel. I see a style attribute with a ton of CSS animations. Its always best not to animate elements with GSAP if their children or parent elements have any CSS animations or CSS transitions on them. Otherwise you will have rendering issues due to the fighting of the two.

 

Also what elements (id or class) are you referring to, you have a lot going on in that example?

 

I am also seeing an error get thrown in the console. I notice terzafrase is an id selector not a class selector like you have in your code.

 

invalid morphSVG tween value: .terzafrase

 

:)

  • Like 3
Link to comment
Share on other sites

A few quick comments:

  1. Be careful about will-change. https://greensock.com/will-change
  2. The invalid morphSVG tween error means you forgot to load MorphSVGPlugin :)
  3. You can try setting CSSPlugin.defaultForce3D to true or false to see if one of those helps (default is "auto"). 
  • Like 4
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×