问题:

Close but not quite there. I'd like to have the first child div displayed for a couple seconds, slide down (via positioning) and fade out of view, then the next child slide up and fade into view. Repeat continuously, looping back after the last child is displayed.

Looks like I've got the loop working though the count seems to pile the child divs on top of each other. What am I doing wrong?

http://jsfiddle.net/rrbaker/Xmk2y/4/

回答1:

Here's my remix: http://jsfiddle.net/ddrace/DJuV7/1/

I rearranged some things to make it more understandable and added settings for the pause and animation to keep it DRY and easier to tweak.

回答2:

Does this look ok http://jsfiddle.net/Xmk2y/5/

I removed the delay , set i = 0 and swapped top values.

回答3:

http://jsfiddle.net/Quincy/Xmk2y/8/

Just using the complete callback to recursively invoke nextQuote

回答4:

It seems there were a few issues according to what you had mentioned. First was setting the index to -1. That seemed to cause the display all issue. Next was the animations, i have updated it to use jquery promises to ensure that the animation of the previous was finished.

End result: http://jsfiddle.net/bfbuS/2/

jQuery Promise: http://api.jquery.com/promise/