CODEWITHSUNDEEP
ioscsswebview
user1391152
user1391152

Reputation: 1289

CSS opacity transition in iOS webview

I am currently developing an html5 app that will be displayed through an iOS webview. In order to use hardware-acceleration of the iPad, I have applied 

transform: translate3d(0,0,0);

to all elements that are animated. This works fine and I can see the difference, however, whenever en element has an opacity transition (ie; fade in / fade out), it is still quite choppy, even though the element has translate3d applied. Am I doing something wrong or is there a different approach to optimize opaicty transitions for iOS?

Upvotes: 1

Views: 362

Answers (1)

Daniel Gomez
Daniel Gomez

Reputation: 26

probably using this:

-webkit-backface-visibility: hidden; /* Chrome, Safari, Opera */
backface-visibility: hidden;

Upvotes: 1

Related Questions