淡入延迟加载 [英] Fade in delay on Load

问题描述

我已经完成了一些相当不错的事情，我想在即将到来的项目中使用。

I've stumpled on something quite nice, I've wanted to use in some upcoming project.

这是加载时的动画不透明度，或者你可以调用它淡入。

It's an animated opacity on load, or you can call it fade in.

我想知道你是否可以将一些元素链接在一起（例如3）所以 element2 仅在 element1 已完成，而 element3 则为no。 2是？

I wondered if you could link some elements together (ex. 3) so element2 only starts when element1 is finished, and element3 when no. 2 is?

或者你应该在 element2 上定义延迟并乘以的延迟element3 ？

Or should you define a delay on element2 and multiply the delay on element3?

推荐答案

如果您有div，请说 class =faded ，你可以在加载时淡入每个，每个都在这样的行中：

If you had divs, say class="faded", you could fade each in on load, each in a row like this:

$(".faded").each(function(i) {
  $(this).delay(i * 400).fadeIn();
});

您可以在此处查看此效果的演示，或此处较慢的版本。 400 是400毫秒，正常 <$的持续时间c $ c> .fadeIn（） speed：）

You can view a demo of this effect here, or a slower version here. The 400 is for 400ms, the duration of the normal .fadeIn() speed :)

您可以使用 .hide（） 在页面加载时隐藏它们，如下所示：

You can either use .hide() to hide them on page load, like this:

$(".faded").hide()

或者在CSS中执行：

.faded { display: none; }

这篇关于淡入延迟加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！