Question

我正在试图弄清楚如何在滚动时重复克隆div的内容，从而给人一种永远和永远的页面印象。到目前为止，我的标记如下，也是一个小提琴https://jsfiddle.net/guht49La/：

var inserated = false
$(window).scroll(function() {
  var scroll = $(window).scrollTop();
  if (scroll >= 800 && inserated == false) {
    var $button = $('.hd').clone();
    ($button).insertBefore('.ap');
    inserated = true;
  } else {

  }
});

虽然这只插入一次，因为我想继续每隔800px插入一次（例如），从而给人的印象是页面永远存在。对此有任何建议将不胜感激！

Answer 1

这是一个完整的猜测，但也许可以试一试：

var nextInsert = 800;
$(window).scroll(function() {
  var scroll = $(window).scrollTop();
  if (scroll >= nextInsert) {
    var $button = $('.hd').clone();
    ($button).insertBefore('.ap');
    nextInsert += 800;
  } else {

  }
});

Answer 2

这将有效

var inserated = false
$(window).scroll(function() {
  var scroll = $(window).scrollTop();
  if (scroll >= 800) {
    var $button = $('.hd').clone();
    ($button).insertBefore('.ap');
    inserated = true;
  } else {

  }
});

Answer 3

它正在工作，但它只克隆了div因为您在插入第一个克隆后将inserated变量更改为true。如果删除它将无限期地工作：

var inserated = false
$(window).scroll(function() {
  var scroll = $(window).scrollTop();
  if (scroll >= 800 && inserated == false) {
    var $button = $('.hd').clone();
    ($button).insertBefore('.ap');
    // inserated = true;
  } else {

  }
});

请注意，inserated = true;已被注释掉。

然而，该代码可以（并且几乎可以肯定）创建大量克隆，因此我建议使用Nat Karmios answer

行中的某些内容来控制滚动插入点

Answer 4

我的建议类似于jbmartinez回答，除了我完全放弃inserated变量并使用类来确定要克隆的元素：

$(window).scroll(function() {
  var scroll = $(window).scrollTop();
  if (scroll >= 800) {
    var $button = $('.hd').not(".cloned").clone();
    $button.addClass("cloned");
    ($button).insertBefore('.ap');
  } else {

  }
});

仍然需要调整滚动标记，如上所述。

jQuery：滚动时多次克隆div

4 个答案: