It appears that Chrome waits for about half a second before beginning the transition. It usually then completes the transition really quickly and jerkily. In all other browsers it seems to work really smoothly.
What is strange is that if I click the menu with a frequency of about once a second, it works smoothly. If I click with a slower frequency, it starts to execute with the delay and jerky animation again.
I am creating the animation by adding an 'invisible' class with an opacity 0 to my content div. This div has the properties:
All my images come off 5 spritesheets which are fairly large (600-800kb). If I change the name of these images so the browser can't find them, the delay problem becomes less severe. All these images are loaded at runtime though so the delay can't be explained by the request.