javascript - 无法延迟加载-任何工作

当您向下滚动时，我正在尝试使整个div .lazyload延迟加载，但似乎无法正确显示。插件（https://github.com/emn178/jquery-lazyload-any）

$('.lazyload').lazyload();

<div class="lazyload">
  <div class="projectWrap">
  </div>
</div>

<div class="lazyload">
  <div class="projectWrap">
  </div>
</div>

http://jsfiddle.net/8y4fdmL0/146/

最佳答案

问题是您没有对.projectWrap div进行评论。因此，在您的html中，您需要从以下位置替换每次出现的div.projectWrap：

<div class="projectWrap">
</div>

至

<!--
  <div class="projectWrap">
  </div>
-->

$('.lazyload').lazyload();

.projectWrap { background-color:#000; margin-bottom:300px; height:450px; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://emn178.github.io/jquery-lazyload-any/src/jquery.lazyload-any.js"></script>

<div class="lazyload">
  <!--
  <div class="projectWrap">
  </div>
  -->
</div>

<div class="lazyload">
  <!--
  <div class="projectWrap">
  </div>
  -->
</div>

<div class="lazyload">
  <!--
  <div class="projectWrap">
  </div>
  -->
</div>

<div class="lazyload">
  <!--
  <div class="projectWrap">
  </div>
  -->
</div>

<div class="lazyload">
  <!--
  <div class="projectWrap">
  </div>
  -->
</div>

<div class="lazyload">
  <!--
  <div class="projectWrap">
  </div>
  -->
</div>

<div class="lazyload">
  <!--
  <div class="projectWrap">
  </div>
  -->
</div>

<div class="lazyload">
  <!--
  <div class="projectWrap">
  </div>
  -->
</div>