无法使用lazyload-any工作

Question

当你向下滚动时，我试图让整个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/

Answer 1

问题是您没有评论您的.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>