CSS Animation won't show on on iOS


#1

Hi,

I added a css animation to my app.
In ripple emulator the opacity and the scale animation shows up,
in iOS Simulator only the opacity.

.pulsate {
    -webkit-animation: pulsate 1.5s linear infinite alternate;
}
@-webkit-keyframes pulsate {
    from {
        -webkit-transform: scale3d(0.8, 0.8, 1);
        opacity: 1;
    }
    to {
        -webkit-transform: scale3d(1.2, 1.2, 1);
        opacity: 0.0;
    }
}

can anyone tell me whats wrong?
thanks!


#2

Maybe try to declare the css animation property and the keyframe declaration without the vendor prefix:

.pulsate {
    animation: pulsate 1.5s linear infinite alternate;
}
@keyframes pulsate {
    from {
        transform: scale3d(0.8, 0.8, 1);
        opacity: 1;
    }
    to {
        transform: scale3d(1.2, 1.2, 1);
        opacity: 0.0;
    }
}

#3

Hi I allready tried that but like this it wont show up in iOS or Chrome at all.