Как рандомизировать fadeTo?

Question

Это крошечный js-файл, захваченный откуда-то, используемый в WordPress, чтобы миниатюры исчезали при загрузке страницы.

(function($) {
    $('.featured-thumbnail').each(function(i) {
        $(this).delay((i++) * 380).fadeTo(1000, 1); })
})(jQuery);

Я хотел бы добавить случайности для меня.

Вопросы: где использовать Math.random? Должен ли я использовать Math.floor также? Мне нужно всего я? Не кажется необходимым.

Медленное обучение JQuery новичка.

Answer 1

Похоже, вы хотите, чтобы миниатюры появлялись в случайном порядке. Если вы в порядке с этими переходами, вы можете сказать:

(function($) {
    var len = $('.featured-thumbnail').length;

    $('.featured-thumbnail').each(function(i) {
    $(this).delay(Math.floor( Math.random() * 380 * len)).fadeTo(1000, 1); })
})(jQuery);

в противном случае вы можете выбрать случайные элементы из вашего списка и добавить их в тот же график, что и в оригинале:

(function($) {
  // jQuery selectors return array-LIKE objects,
  // but not actual arrays. We need a real array.
  //
  var items = $.makeArray( $('.featured-thumbnail') );
  var i = 0;

  while (items.length > 0)
  {
    // pick a random index within our array
    //
    var idx = Math.floor( Math.random() * items.length );

    // grab that item, remove it from the array.
    // splice() returns an array, so grab the first (only)
    // element from that array. splice() removes the
    // selected element(s) from the original array
    //
    var selected = items.splice(idx, 1)[0]; 

    // delay and fade in as before
    //
    $(selected).delay(i++ * 380).fadeTo(1000, 1);
  }
})(jQuery);