在淡入淡出的新文字時推舊文本

我希望新文本在淡入時可以向下推舊文本，而不是在舊文本之後出現新文本。這可能嗎？解決這個問題有很多困難。在淡入淡出的新文字時推舊文本

這裏是JavaScript：

var $el= $('.fader').map(function() { 
    return this; 
}).get(); 

$el.forEach(function (eachdiv){ 



var text = $(eachdiv).text(), 
words = text.split("."); 
var html = ""; 

for (var i = 0; i < words.length; i++) { 
    html += "<span>" + words[i] + " </span>" + '<br/>'; 
     $(eachdiv).html(html).children().hide().each(function(i){ 
      return $(this).delay(i*200).fadeIn(200); 

     });   
    } 
});

的解決方案似乎涉及利用前置的，但我不知道在何處放置代碼中預先準備。

來源

2017-09-25 ilyya

嘗試循環，而不是你的。只是給你一個想法。根據您的數據到達時給予淡入效果。

for (var i = 0; i < words.length; i++) { 
     html.prepend("<span>" + words[i] + " </span>" + '<br/>'); 
      $(eachdiv).html(html).children().hide().each(function(i){ 
       return $(this).fadeIn(200); 

      });   
     }

來源

2017-09-25 06:58:20 Sindhoor

這確實會改變單詞的順序，但它不會使較新的單詞出現在較早的單詞之前。因此，下一個單詞在淡出前一個單詞佔據的位置，前一個單詞被移到下一個單元。 – ilyya

你嘗試過的代碼？ – Sindhoor

是的，我不理解，因爲我只是看翻譯順序的話。 – ilyya

這似乎在返回行的工作：

return $(this).delay(i*200).prependTo(eachdiv).fadeIn(200);

謝謝你介紹我要前置，Sindhoor！

來源

2017-09-25 14:48:22 ilyya

在淡入淡出的新文字時推舊文本

回答

相關問題