تتلاشى jQuery قبل أن تتلاشى

Question

أقوم بصنع محفظتي ، على أساس جافا سكريبت تمامًا. 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');
    });
});

وبهذه الطريقة ، لا ترفق الرسوم المتحركة أو رد الاتصال الإشكالي للعناصر التي هي سابقا مختفي.