about CSS3 translate3d flicker ,checked lots answer,but seems unlucky

Question

First of all,I am doing a html5 webapp on iOS, especially iPad.when touchmove,the div should move with my finger together,I used to change the left value to make this effect,but it seems not smooth enough ,so I used translate3d to do it,it seems great! And then,I just found the strange flicker happend,there are white flicker or flash in there several time when finger move the div.by the way,after moved once,the flicker is dispear. So,I check a lots of functions which include:

-webkit-perspective: 1000;

-webkit-backface-visibility: hidden;

-webkit-transform: translate3d(0,0,0) rotate(0) scale(1);

But no one works except change the flicker color to grey=.= So,this is my question.(iOS 5.01)

Answer 1

I had more strange issue when copies of input elements were displayed as artifacts all over the next content after scrolling down and up. And couple lines of CSS saved the day (actually days of struggling :)

Make sure you use such CSS for your scrolling container and all children inside of it

.scrolling-container {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

.scrolling-container .child-element {
    position: relative;
    -webkit-transform: translate3d(0,0,0);
}

Answer 2

you should check the children, try giving them

transform: translate3d(0,0,0);

-webkit-transform: translate3d(0,0,0);