如何为 jssor 滑块随机选择几张幻灯片并隐藏其余幻灯片？

Question

我有 8 张幻灯片，我想在每次用户刷新页面时随机显示 3 张。我该如何实现？

Answer 1

我决定将幻灯片放在另一个 div 中并隐藏起来。然后使用来自 jQuery select random elements with same class 的解决方案，我将 div 的 3 个切片，然后将其复制到 jssor 幻灯片中。

function shuffle(array) {
  var m = array.length, t, i;

  // While there remain elements to shuffle…
  while (m) {

  // Pick a remaining element…
  i = Math.floor(Math.random() * m--);

  // And swap it with the current element.
  t = array[m];
  array[m] = array[i];
  array[i] = t;
  }

  return array;
}

jQuery(document).ready(function ($) {
    var $all = $(".all-slides > div").removeClass("selected");
    $(shuffle($all).slice(0, 3)).addClass("selected");
    $( ".selected" ).appendTo( ".slides" );
        var options = {
            $DragOrientation: 0,                                //[Optional] Orientation to drag slide, 0 no drag, 1 horizental, 2 vertical, 3 either, default value is 1 (Note that the $DragOrientation should be the same as $PlayOrientation when $DisplayPieces is greater than 1, or parking position is not 0)
            $ArrowNavigatorOptions: {                       //[Optional] Options to specify and enable arrow navigator or not
                $Class: $JssorArrowNavigator$,              //[Requried] Class to create arrow navigator instance
                $ChanceToShow: 2,                               //[Required] 0 Never, 1 Mouse Over, 2 Always
                $AutoCenter: 0,                                 //[Optional] Auto center arrows in parent container, 0 No, 1 Horizontal, 2 Vertical, 3 Both, default value is 0
                $Steps: 1                                       //[Optional] Steps to go for each navigation request, default value is 1
            }
        };

        var jssor_slider1 = new $JssorSlider$("slider_container", options);
});

如何为 jssor 滑块随机选择几张幻灯片并隐藏其余幻灯片？

How to pick random few slides for jssor slider and hide the rest?

javascript

jquery

slider

carousel

jssor