爲什麼我的setTimeout函數fadeOut，用jQuery的replaceWith（）不工作延遲替換和淡入文本？

Question

替換髮生的褪色不...這是我的代碼：

$(document).ready(function() { 
var delay = 3000; //3 seconds 

setTimeout(function(){ 
    $('.header p').fadeOut(300, function(){ 
    $('.header p').replaceWith("<p>A LIFESTYLE FOR EVERYONE</p>"); 
    }); 
    $('.header p').fadeIn(300); 
}, delay); 
console.log("replaced"); 
}); 

Answer 1

更換元素是有問題的，當你不隱藏新的，改變它的內容，而不是

你可以避免同一元件的多個DOM搜索由第一動畫

setTimeout(function(){ 
    $('.header p').fadeOut(300, function(){ 
      $(this).text("A LIFESTYLE FOR EVERYONE").fadeIn(300);   
    }); 
}, delay); 

的回調內部鏈接的東西通過僅更換它使參考元素中的內容，並允許鏈

Answer 2

嘗試使用text代替replaceWith，並把淡入回調中：

$(document).ready(function() { 
var delay = 3000; //3 seconds 

setTimeout(function(){ 
    $('.header p').fadeOut(300, function(){ 
    $('.header p').text("A LIFESTYLE FOR EVERYONE").fadeIn(300); 
    }); 

}, delay); 
console.log("replaced"); 
}); 

如果你這樣做replaceWith，要創建未淡出新頁。另外，您想在之後將其淡入，但它會淡出（而不是同時）。