CSS transition chaining: timing issue in Opera

I am working on a slide show, where each old image slides off-screen to the right, followed by a new image sliding in from the left. I managed to get this working by chaining three transitions, through a webkitTransitionEnd handler: 1. slide image off-screen to the right, and replacing the image by the next; 2. jump image from the right to the left, off-screen; 3. slide image on-screen from the left.

This works in Firefox, but in Opera and Chrome the new image slides in from the right. The essence of the technique, with text label instead of image: (see CodePen).

I suspect the jump to the left is optimised out in Opera and Chrome. Adding back the javascript alert, currently commented out, restores the intended slide from the left.

Two questions: 1. What is going on here? Is it a bug in Opera/Chrome, or am I more or less lucky to get this chaining to work in Firefox? 2. Is there a better technique to implement this slideshow functionality?