gpt4 book ai didi

javascript - 实现洗牌图片功能

转载 作者:行者123 更新时间:2023-11-29 10:51:20 25 4
gpt4 key购买 nike

我正在寻找有关如何启动随机播放图像功能的建议,所以我在一个 div 框中有 6 张图像 atm,我想要一个允许它们随机播放的功能,我应该如何开始?我是否也应该将图像放在单独的 div 中?感谢任何帮助或示例代码,谢谢

最佳答案

以下是一个 jQuery 解决方案。您可以使用 vanilla JavaScript 获得相同的结果,但它需要几行额外的代码。

<div id="deck">
<div><img src="" /></div>
<div><img src="" /></div>
.
.
.
</div>
// Fisher–Yates Shuffle (Knuth variant)
// To shuffle an array a of n elements (indices 0..n-1):
// for i from n - 1 downto 1 do
// j <- random integer with 0 <= j <= i
// exchange a[j] and a[i]

// jQuery specific:
// 1) remove elements from DOM and convert them into a native JavaScript array
// 2) apply algorithm
// 3) inject the array back to DOM

var a = $("#deck > div").remove().toArray();
for (var i = a.length - 1; i >= 1; i--) {
var j = Math.floor(Math.random() * (i + 1));
var bi = a[i];
var bj = a[j];
a[i] = bj;
a[j] = bi;
}
$("#deck").append(a);

Demo here

关于javascript - 实现洗牌图片功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9643484/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com