一一淡入p标签

Question

假设我有几个 p 标签：

<p>Style never met and those among great. At no or september sportsmen he perfectly happiness attending. Depending listening delivered off new she procuring satisfied sex existence. Person plenty answer to exeter it if. Law use assistance especially resolution cultivated did out sentiments unsatiable. Way necessary had intention happiness but september delighted his curiosity. Furniture furnished or on strangers neglected remainder engrossed.</p>

<p>Not far stuff she think the jokes. Going as by do known noise he wrote round leave. Warmly put branch people narrow see. Winding its waiting yet parlors married own feeling. Marry fruit do spite jokes an times. Whether at it unknown warrant herself winding if. Him same none name sake had post love. An busy feel form hand am up help. Parties it brother amongst an fortune of. Twenty behind wicket why age now itself ten.</p>

<p>For though result and talent add are parish valley. Songs in oh other avoid it hours woman style. In myself family as if be agreed. Gay collected son him knowledge delivered put. Added would end ask sight and asked saw dried house. Property expenses yourself occasion endeavor two may judgment she. Me of soon rank be most head time tore. Colonel or passage to ability.</p>

它们是opacity:0 ，我想一个一个地淡入其中，延迟为 350 毫秒。

我该怎么做？

我所有的尝试

$.each($('p'), function(index,element){
    setTimeout(function(){ $(element).fadeIn(); }, 350);
});

最终同时在所有 p 标签中消失。

Answer 1

这应该做：

$("p").each(function(index) {
    $(this).delay(350*index).fadeOut(300);
});

Answer 2

它们同时进行的原因是超时几乎都是在同一时间设置的。 这意味着它们将从每个运行时开始等待 350 秒。

尝试这个

ps = $('p').toArray();

function fadeNext(ps){
   $(ps[0]).fadeIn(350, function(){
      ps.shift();
      if(ps.length){
         fadeNext(ps);
      }
   })
}

这是一个淡出的代码片段：

 function fadeNext(ps) { console.log($(ps[0])) $(ps[0]).fadeOut(350, function() { ps.shift(); if (ps.length) { fadeNext(ps); } }) } $('#fade_button').click(function() { ps = $('p').toArray(); fadeNext(ps); })

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <p>Style never met and those among great. At no or september sportsmen he perfectly happiness attending. Depending listening delivered off new she procuring satisfied sex existence. Person plenty answer to exeter it if. Law use assistance especially resolution cultivated did out sentiments unsatiable. Way necessary had intention happiness but september delighted his curiosity. Furniture furnished or on strangers neglected remainder engrossed.</p> <p>Not far stuff she think the jokes. Going as by do known noise he wrote round leave. Warmly put branch people narrow see. Winding its waiting yet parlors married own feeling. Marry fruit do spite jokes an times. Whether at it unknown warrant herself winding if. Him same none name sake had post love. An busy feel form hand am up help. Parties it brother amongst an fortune of. Twenty behind wicket why age now itself ten.</p> <p>For though result and talent add are parish valley. Songs in oh other avoid it hours woman style. In myself family as if be agreed. Gay collected son him knowledge delivered put. Added would end ask sight and asked saw dried house. Property expenses yourself occasion endeavor two may judgment she. Me of soon rank be most head time tore. Colonel or passage to ability.</p> <button id="fade_button">try it</button>

Answer 3

试试这个：

$("p").each(function(index) {
   $(this).delay(350*index).animate({opacity:1});
});