jssor图像滑块中的随机幻灯片顺序答案

【问题标题】：Random slide order in jssor image sliderjssor图像滑块中的随机幻灯片顺序
【发布时间】：2017-12-04 02:54:16
【问题描述】：

我正在使用 jssor javascript 图像滑块的变体。我可用的代码是深度最小化的代码。我打算制作随机幻灯片顺序，但找不到方法。

（有一种方法可用于随机染色，但这不是我感兴趣的）。

我还尝试在代码中围绕“数学”等一些公式进行一些修改，但无济于事。已经好几个星期了。

有人可以指导吗？

我的js的变种开启 Jssor Variant Slider I am using 非常感谢您的任何建议。

【问题讨论】：

您可以在初始化 jssor 滑块之前更改幻灯片顺序（幻灯片容器中的 html 代码）。
好的，当然可以，但是怎么做？您是指独立于 jssor 的脚本吗？谢谢。
提取`slides'容器中的所有子元素，并随机追加每个子元素。
OK 完美。我使用了jsfiddle.net/qEM8B 中给出的方法，效果很好。感谢您的建议。

标签： javascript slider jssor

【解决方案1】：

我仔细检查了 jssor 文档，似乎没有内置随机顺序功能。使用 php 有一个非常简单的解决方案。使用这种方法，您每次打开网站时都会有随机的幻灯片顺序。 10 张幻灯片有超过 360 万个组合，因此是随机的。

通常在 jssor 中，您的幻灯片有以下代码：

<div data-p="375.00"><img data-u="image" data-src2="path/to/1.jpg" alt=""></div>
<div data-p="375.00"><img data-u="image" data-src2="path/to/2.jpg" alt=""></div>
<div data-p="375.00"><img data-u="image" data-src2="path/to/3.jpg" alt=""></div>
<div data-p="375.00"><img data-u="image" data-src2="path/to/4.jpg" alt=""></div>

如何随机化幻灯片顺序？？？

有一个 php 函数可以生成从 $numbers = range(1,4); 到 $numbers = range(1,4); 的数字，在本例中是从 1 到 4。

然后，您需要洗牌。 shuffle($numbers);

现在，您所要做的就是回显您的 html 代码。

要使此方法起作用，您必须使用数字作为图像名称。

工作示例

<?php

//enter number of slides
$number_of_slides = '4';

$numbers = range(1, $number_of_slides);
shuffle($numbers);
foreach ($numbers as $number){
    echo '<div data-p="375.00"><img data-u="image" data-src2="path/to/'.$number.'.jpg" alt=""></div>';
}
?>

如果您需要每个循环的随机滑动顺序，则必须使用 javascript 找到解决方案。

【讨论】：