將鼠標懸停在動畫文本上后，文本淡入淡出不會返回

Question

在我們的網站上，我們有一個徽標標題文本，旁邊是其他文本，這些文本會定期淡出並更改文本。

問題是，一旦將徽標懸停在文本上方，淡入淡出將不會生成下一階段的文本，即使不再將徽標懸停在徽標上也不會回來。

如何阻止文本消失而不返回？

的代碼是

 //FADER TEXT
        $('#headerFader').carousel({
            interval: 2500,
            pause: false
        });

        //BACK HOME TEXT
       $('#headerText').hover(
           function(){
               $(this).find("h1#masterHeader").animate({opacity:0}, 0, function(){
                   $(this).css("display", "none");
                   $('#headerText').find("h1#takemeback").css("display", "block");
                   $('#headerText').find("h1#takemeback").animate({opacity:1,});
               });
           },
           function(){
               $(this).find("h1#takemeback").animate({opacity:0}, 0, function(){
                   $(this).css("display", "none");
                   $('#headerText').find("h1#masterHeader").css("display", "block");
                   $('#headerText').find("h1#masterHeader").animate({opacity:1,});
               });
           }
       );

為了解決這個問題，我在第二個函數中像這樣復制了headerfader

function(){
       $(this).find("h1#takemeback").animate({opacity:0}, 0, function(){
           $(this).css("display", "none");
           $('#headerText').find("h1#masterHeader").css("display", "block");
           $('#headerText').find("h1#masterHeader").animate({opacity:1,});
           //FADER TEXT
            $('#headerFader').carousel({
                interval: 2500,
                pause: false
            });

       });
   }

有沒有一種更優雅的方式做到這一點，而不是重復headerfader？

Answer 1

您的動畫函數中似乎有一個逗號結尾，

$('#headerText').find("h1#takemeback").animate({opacity:1,});

嘗試刪除它，看看會發生什么。