javascript - 使用 jquery 一次随机淡出 9 个缩略图的图库

标签 javascript jquery

我有 9 个缩略图 (3 x 3),在页面加载时我想随机淡入这些图像,所以也许图像 #4 淡入然后 8 然后 3...

目前我正在尝试弄清楚如何做到这一点,是否必须为每个图像生成一个随机数,然后循环遍历每个元素,将数字添加到 .data 属性?

到目前为止,我已经成功创建了一个生成随机数的变量,但不确定如何集成循环,http://jsfiddle.net/kyllle/MGW8k/

凯尔

最佳答案

请参阅此工作示例:http://jsfiddle.net/wCb93/1/

用于生成数字和淡入新图像的代码全部包含在一个函数中。这允许该函数在图像完成淡入后调用自身,从而淡入下一个图像。

我还将 .eq() 方法的可用索引号存储在数组中。并且,与此相关的是,我修改了随机数生成,以便它使用该数组的长度而不是 img 元素组的 length 属性。这使我可以简单地从该数组中删除一个项目并将其值传递给 .eq() 方法。由于该项目不再位于数组中,因此我不必担心将已淡入的值传递给 .eq()。

我还修改了您的 CSS,将图像的不透明度设置为 0,而不是让它们显示:无。即使它们不可见,它们也会保持布局不变。

关于javascript - 使用 jquery 一次随机淡出 9 个缩略图的图库,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7178807/

相关文章:

javascript - 自动完成 : prevent Change event after Select event

javascript - 移动浏览器上的固定比例元素

javascript - 加载js时遇到问题

javascript - 翻译 JQuery Mobile 小部件

javascript - 通过 jQuery 隐藏超时 block

javascript - 如何在 meteor 页面加载后调用函数

javascript - Div onclick 切换需要点击两次

javascript - 在 appendChild 上未加载 Jquery 脚本

javascript - 如何先不提交表单,然后再提交呢?

javascript - Backbone : Different views for different tab content