JavaScript连续垂直转盘

Question

我目前正在使用JavaScript进行连续垂直图像轮播，并且无法解决我目前使用的代码所遇到的问题。就目前而言，图像将到达页面顶部并移动到底部，尽管方式非常不稳定。它目前在http://chilcomptonsports.clients.hadrill.org.uk/carousel.php

处可见

http://jsfiddle.net/Z7mB8/ - 修剪代码

var ticker = $('#sports');
var container = $('#sports > div');
var spacing = ticker.outerHeight() - ticker.height();

function animator(currentItem) {
    var distance = currentItem.outerHeight() + spacing;

    var currentTop = parseInt(container.css('margin-top'), 10);

    var duration = (distance + currentTop) / 0.05;

    container.animate({ marginTop: -distance}, duration, "linear", function() {
        var parent = currentItem.parent();

        currentItem.detach();
        parent.css("marginTop", 1);

        parent.append(currentItem);
        animator(parent.children(":first"));
    });
};


animator(container.children(":first"));
ticker.mouseenter(function() {
    container.stop();
});

ticker.mouseleave(function() {
    animator(container.children(":first"));
});