translate3d's z property not working on ipad (Using Phonegap)

translate3d's z property not working on ipad (Using Phonegap)

I have been working on an ios app using phonegap. I am trying to change
element's z position using -webkit-transform: translate3d property.. here
is my code
.content {
-webkit-transform-style: preserve-3d;
-webkit-transform-origin: 50% 100%;
-webkit-perspective:530;
-webkit-backface-visibility: hidden;
}
.content .activities-item{
-webkit-transform: translate3d(0,0,0) scale3d(1,1,1);
-webkit-transition :all .4s;
-webkit-backface-visibility: hidden;
opacity: 1;
}
and on click , I am adding active class to content container.
.content.active .activities-item{
-webkit-transform: translate3d(0,0,450px) scale3d(1,1,1);
opacity: 0;
}
This code is working fine on webkit browser but not in iPad. On iPad there
is no issue on changing x,y position but z property is not working at all.
Any suggestion..
Not: I'm trying to make zoom script that works on iPad.