CSS transform translate3d image animation strange anti-aliasing behavior causes jitter

Question

I have a jsFiddle example of an image animating from left to right using CSS3 translate3d, here: http://jsfiddle.net/Rhx2K/3/

I have a requestAnimationFrame looping 60fps and setting the left position of a JPG image on every frame at sub-pixel intervals.

var image1 = document.getElementById('image1');
var image2 = document.getElementById('image2');

var image1Left = 0;
var image2Left = 0;
var subpixel   = 1 / 64;

var _run = function(){
    window.requestAnimFrame(_run);
    image1Left += subpixel * 5;
    image2Left += subpixel;
    image1.style.webkitTransform  = 'translate3d('+image1Left+'px, 0px, 0px)';
    image2.style.webkitTransform  = 'translate3d('+image2Left+'px, 0px, 0px)';
}

_run();

I put two images in the example. They are both doing the same thing, just the top one is moving faster. Notice how it has this stair-stepping effect. The image itself gets translated at the subpixel level. Notice how the image moves at constant rate - you can see the trees seem to glide along, but that the left and right side are jittering. After experimenting, I realized that the anti-aliasing is greater the further away from the pixel. For example at left: 1px, there is no anti-aliasing, but at left: 1.2px, there is some, then at left: 1.5px there is more. At left: 1.7px there is less, and then at 2px, there is none. So the wobble here is due to the relative anti-aliasing at each subpixel step. This would make sense if it didn't cause this jitter.

This happens also when using a webkit transition on the transform. http://jsfiddle.net/Rhx2K/5/

Is this standard behavior? It seems to be a bug with webkit itself.

My way around it has been to animate by pixel values only, as seen here: http://cmivfx.com/home

With pixel values (vs subpixel values), no antialiasing is added to the image and so the animation looks really smooth... the only problem I have that point is that full pixel increments cause the image to move too fast. I need subpixel increments to slow down the animation.

I've tried all of these....

-webkit-transform: translate3d(0, 0, 0);
-webkit-perspective: 1000;
-webkit-backface-visibility: hidden;
-webkit-transform-style: preserve-3d;

None of that is the answer. How do I get the translate3d animation to look good at sub-pixel increments?