Question

这是一个很小的js文件，从某个地方抓取，用于wordpress，使缩略图在页面加载时淡入。

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

我想给i添加随机性。

问题是：在哪里使用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);

如何随机化fadeTo？

1 个答案: