CODEWITHSUNDEEP
ioscss
Freestyle09
Freestyle09

Reputation: 5508

How to set opacity animation working on Iphones?

I want to create a simple animation on ::after and ::before elements and on Desktop everything works well but on iOS, on Chrome I'm getting no opacity effects.

@keyframes sunshine {
  from {
    opacity: 30%;
    transform: scale(0);
  }
  to {
    opacity: 0%;
    transform: scale(4);
  }
}

This opacity is not working on iPhones and instead of opacity effect, I'm getting 100% background-color.

Is there any way to turn on the Alpha channel on iPhones ??

Upvotes: 0

Views: 91

Answers (1)

Saran
Saran

Reputation: 1575

Try to give opacity value in floating-point numbersopacity: .3 instead of percentage values. Safari browser won't allow percentage value.

https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html

Upvotes: 2

Related Questions