Currently I’m developing a webpage for multiple mobile platforms. I use JQuery and JQuery Mobile as library. The page uses only HTML5, CSS3 and JavaScript.
The day picker I’m writing uses the –webkit-transform: transform(0,-20px) function to scroll a list of numbers. This works fine in Chrome, Safari, iOS, Android 2.3.*. But on Android 4.0.1 it changes the order of the different elements. This results in a text jumping in front of the overlay making the spinner ugly. I’ve tried using the z-index but this doesn’t affect the transform animation.
When changing the margin-top instead of the transform works fine on Android 4.0 but I want to use the hardware accelerated css functions.
Is there anyone who could help me with this problem?