Smooth 3d transforms in Phonegap Android

I'm trying to make an application with a gallery using Phonegap. In it, I am using jQuery and iScroll4.

I need to make the effect of increasing the size of the central element.To do this, I set the item parent property -webkit-perspective: 1200px and the item itself -webkit-transform: translateZ (150px); -webkit-transform-style: preserve-3d. It looks good in Chrome, but does not work on Android 2.2 (Samsung Galaxy) and 2.3 (Kindle Fire). On Android 3.0 (Motorola Xoom) it works, but jerky.

I tried to use -webkit-transform: scale (1.14). It works on all devices, but it still jerks. Variants with change height / width or zoom also did not give good results.

How can I make this effect smoothly on all (Android) devices?

I will be grateful for any informative answer.

Solution

Maybe this, CSS3 scale using absolute positioning

<html>
<head>
<style type="text/css">
img {
    position:absolute;
    top:50px; left:50px;
    height:60px; width:80px;
    -webkit-transition:all 0.2s ease;
}
img:hover {
    top:35px; left:30px;
    height:90px; width:120px;
}
</style>
</head>

<body>
    <img src="image.png" />
</body>
</html>