0

表示されているこのスクリプトを見るalert('hey');と、ドキュメントの先頭に5回追加されています。問題はありませんが、一度だけ実現する方法を知りたいです。

$('#logo').fadeIn(2000, function() {
        $(this).animate({ top: "-=20px" },{
        duration: 1000, 
        specialEasing: {top: 'easeOutQuad', left: 'easeInQuad'},      
            complete: function () {
                $(this).animate({ top: "63px" },{
                duration: 1000, 
                specialEasing: {top: 'easeOutQuad', left: 'easeInQuad'},      
                    complete: function () {
                    }
                });
                $('.home,.about,.investments,.media,.contact').animate({ top: "+=106px" },{
                duration: 2000, 
                specialEasing: {top: 'easeOutQuad', left: 'easeOutQuad'},     
                    complete: function () {
                        $('#ballTarp').remove();
                        $("head").append( '<link href="css/hoverStates.css" rel="stylesheet" type="text/css">' );
                        alert('hey');
                        $('#ball').removeClass('home').addClass('activeHome');
                        $('.activeTitle').fadeIn("fast");
                        $('.dropShadow').fadeIn(7000);
                        $('footer').fadeIn("fast");
                        $('.title').fadeIn("slow");
                        $('.login').fadeIn(3000);
                    }
                });
            }
    });
4

3 に答える 3

3

各セレクター (.home、.about、.investments、.media、.contact) の完全な関数を呼び出しています。

そのため、5 回追加しています。

これはうまくいくはずです...

$('#logo').fadeIn(2000, function() {
    $(this).animate({ top: "-=20px" },{
    duration: 1000, 
    specialEasing: {top: 'easeOutQuad', left: 'easeInQuad'},      
        complete: function () {
            $(this).animate({ top: "63px" },{
            duration: 1000, 
            specialEasing: {top: 'easeOutQuad', left: 'easeInQuad'},      
                complete: function () {
                }
            });
            $('.home,.about,.investments,.media,.contact').animate({ top: "+=106px" },{
            duration: 2000, 
            specialEasing: {top: 'easeOutQuad', left: 'easeOutQuad'},     
                complete: function () {
                    $('#ballTarp').remove();
                    // not here...
                    $('#ball').removeClass('home').addClass('activeHome');
                    $('.activeTitle').fadeIn("fast");
                    $('.dropShadow').fadeIn(7000);
                    $('footer').fadeIn("fast");
                    $('.title').fadeIn("slow");
                    $('.login').fadeIn(3000);
                }
            }, function(){
                // but here...
                $("head").append( '<link href="css/hoverStates.css" rel="stylesheet" type="text/css">' );
                alert('hey');

            });
        }
});
于 2012-11-28T17:36:51.767 に答える
1

これは、セレクタ内のすべての要素に対して 1 回ずつ、5 回実行されているためです。

$('.home,.about,.investments,.media,.contact')
于 2012-11-28T17:37:12.883 に答える
0

わかりました @teewuane と @epascarello に感謝します

$('#logo').fadeIn(2000, function() {
        $(this).animate({ top: "-=20px" },{
        duration: 1000, 
        specialEasing: {top: 'easeOutQuad', left: 'easeInQuad'},      
            complete: function () {
                $(this).animate({ top: "63px" },{
                duration: 1000, 
                specialEasing: {top: 'easeOutQuad', left: 'easeInQuad'},      
                    complete: function () {
                    }
                });
                $('.home,.about,.investments,.media,.contact').animate({ top: "+=106px" },{
                duration: 2000, 
                specialEasing: {top: 'easeOutQuad', left: 'easeOutQuad'},     
                    complete: function () {
                        $('#ballTarp').remove();
                        $('#ball').removeClass('home').addClass('activeHome');
                        $('.activeTitle').fadeIn("fast");
                        $('.dropShadow').fadeIn(7000);
                        $('footer').fadeIn("fast");
                        $('.title').fadeIn("slow");
                        $('.login').fadeIn(3000);
                    }
                });
                $("head").append( '<link href="css/hoverStates.css" rel="stylesheet" type="text/css">' );
            }
    });
于 2012-11-28T18:02:28.233 に答える