Двойная анимация jQuery с использованием плагина jquery замедления

Question

Я хочу реализовать что-то вроде этой страницы: ссылка

Посмотрите на окно кликера. Коробка имеет две анимации. Один для easeInQuad, а другой - для easeInOutSine.

Как я могу реализовать что-то подобное в моей собственной функции?

$(function() 
{
    var iH = window.innerHeight + 80;
    var position = $(window).scrollTop();

    $(window).scroll(function() 
    {
        var scroll = $(window).scrollTop();

        if(scroll > position) 
        {
            $("body").animate(
            {
                scrollTop: iH
            },1000,
            "easeInOutQuart")
            .animate(
            {
                scrollTop: parseInt($(window).scrollTop()) - 80
            },1000,
            "easeInOutQuart");
        } 
        else if(scroll < position) 
        {
            $("body").get(0).scrollTop = 0;
        }

        position = $(window).scrollTop();
    });
});

Вторая анимация работает не очень хорошо. Но это прокрутить вверх. Но это слишком много, а не только 80 пикселей. Он прокручивает его вверх, затем анимация попадает в бесконечный цикл. После второй анимации он будет продолжать оживлять снова и снова и снова. Без остановки.

Answer 1

$ ( "тело"). Остановить (правда)

Это очистит все очереди анимации на объекте.

http://docs.jquery.com/Effects/stop

Answer 2

Я думаю, что лучше использовать эффект переключения

http://www.sohtanaka.com/web-design/examples/toggle/