CSS3 Spinning Animation doesn't work on Iphone - ios

Question

Can anybody tell why this CSS3 Animation refuses to work when I test it on my Iphone? It works fine on Chrome.
.heartbeat:after {
content: "\f118";
font-family: fontAwesome;
font-size: 50px;
color: rgb(0, 156, 255);
-webkit-animation: spin 1000ms ease 0s infinite normal;
-moz-animation: spin 1000ms ease 0s infinite normal;
-ms-animation: spin 1000ms ease 0s infinite normal;
-o-animation: spin 1000ms ease 0s infinite normal;
animation: spin 1000ms ease 0s infinite normal;
}
#-ms-keyframes spin {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
}
#-moz-keyframes spin {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
}
#-webkit-keyframes spin {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
}
#keyframes spin {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
}
I checked similar questions and tried to replace from and to with 0% and 100%, and rotate 180 degrees at a time, use rotate3d instead; didnt work.

Answer 1

There is a reason behind this. You have an error here:
#-ms-keyframes spin {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
}
#-moz-keyframes spin {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
}
#-webkit-keyframes spin {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
}
#keyframes spin {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
}
Notice anything here, for example?
#-moz-keyframes spin {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
}
You're using a -moz- keyframe, which is fine, but notice anything else?
How about the -webkit- prefix on the transform?
So, in essence, this would become:
#-moz-keyframes spin {
from { -moz-transform: rotate(0deg); }
to { -moz-transform: rotate(360deg); }
}
Repeat this for your other keyframes and this should sort out a problem or two...