jquery исчезает до исчезновения

Question

Я делаю свой портфолио, полностью на основе JavaScript. http://portfolio.theadamgaskins.com/portfolio/

Моя проблема, когда вы нажимаете одну из кнопок навигации, новая страница запускается одновременно, что другая страница исчезает. Текущая страница должна исчезнуть до того, как новая страница исчезает. Вот код, который я использую:

    $("#homeButton").click(function()
    {
        $('.page[id!="homePage"]').fadeOut('400', function()
        {
            $("#homePage").fadeIn('400');
        });
    });

Это вне контекста; не стесняйся View Source на сайте.

Answer 1

Это происходит потому, что некоторые из элементов уже Скрытый, поэтому их обратные вызовы выполняются немедленно ... вызывая вашу одновременную анимацию. Чтобы исправить это добавить :visible Вашему селектору элементов, которые вы хотите анимировать, как это:

$("#homeButton").click(function() {
    $('.page[id!="homePage"]:visible').fadeOut('400', function() {
        $("#homePage").fadeIn('400');
    });
});

Таким образом, вы не прикрепляете анимацию или проблемный обратный вызов к элементам, которые являются уже скрытый.