jQuery - Animar elemento que tem filhos posicionados absolutamente fora dele - piscando

Perdoe-me se isso já foi abordado antes, não consegui encontrar nada.

Eu estou animando uma barra de conteúdo que tem filhos absolutamente posicionados fora dela (via margens negativas). A ideia é que as crianças se animam com a barra à medida que se expande.

O que acontece é que, assim que a animação começa, as crianças desaparecem e reaparecem quando a animação é concluída. É como se a animação precisasse ser concluída antes que o navegador saiba onde colocar as crianças.

Eu fiz upload de um exemplo muito simples aqui, todos os scripts incluídos na página:http://www.ismailshallis.com/jdemo/

O que está realmente acontecendo? Quais são minhas opções para contornar isso?

Muito obrigado antecipadamente,

Belinda

questionAnswers(4)

yourAnswerToTheQuestion