如何用动画动态加载页面元素（即图像）？
我有一个 2 行 3 列的大方块网格，我将在其中放置缩略图链接以进行分类导航。然而，稍后我会担心正方形内的元素，因为这个问题涉及实际的正方形本身。
首先，我想预加载所有元素并立即显示它们。这部分不需要动画效果。他们可以像平常一样突然出现。
其次，我希望这个正方形网格进入。页面的其余部分和正方形可以同时进入，因为它们将一起加载。然而，这部分确实需要动画效果；我希望正方形及其各自的子元素从无到有放大。
请参阅此处的“缩放”效果。
第三，我想按顺序在方块中加载/制作动画，从第一个到最后一个，每个方块单独出现（或稍微重叠）。我确信我们现在只是在讨论参数。
好吧，就是这样。我知道这是一个艰巨的任务，但我对 jQuery 还很陌生，所以希望有人可以帮助至少其中一些！
I have a 2-row, 3-column grid of large squares that I'm going to place thumbnail links inside of for categorized navigation. I will worry about elements within the squares later, however, as this question pertains to the actual squares themselves.
First, I want to preload all elements and display them at once. This portion doe not require an animation effect. They can just pop in like normal.
Second, I want this grid of squares to come in. The rest of the page and the squares can come in simultaneously since they will be loaded together. This portion does, however, require an animation effect; I want the squares and their respective children elements to zoom in from nothing.
See the "zoom" effect here.
Third, I'd like to load/animate in the squares in a sequential order, from first to last, each one coming in individually (or slightly overlapping). I'm sure we're just talking parameters now.
Well, that's it. I know this a tall order, but I'm pretty new to jQuery so hopefully someone can help with at least some of it!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
我创建了一个插件来做类似的事情。在这里看看：https://github.com/navgarcha/jquery-slotload
可以使用
onComplete选项将加载的项目移动到第一个.loading图像之前，以便它们看起来是按顺序加载的。由于您需要缩放效果而不是类似老虎机的效果，因此您可以替换动画代码来进行缩放。
请随意分解代码以适合您。
I created a plugin todo something similar to this. Have a look at it here: https://github.com/navgarcha/jquery-slotload
You could use the
onCompleteoption to move loaded items before the first.loadingimage so they appear to load in sequence.As you require a zoom effect rather than a slot machine like effect you can prob replace the animate code todo the zoom.
Feel free to tear apart the code to suit you.