图片懒加载的问题？

Question

我现在在做一个图片懒加载。

首先，页面载入时，img标签有两个属性，一个src是一张默认图片，一个data-src是图片的真实地址。

然后循环图片，通过滚动页面，监听图片是否到达可视区域，如果到了，就把图片的data-src的值赋给src。

经过测试没有问题，达到了图片懒加载。

但是，后来发现页面里存在tab切换，因为tab中其他的div项是默认隐藏的（display：none），因此无法获取隐藏div中图片的offsetTop，从而导致页面载入时，这些隐藏div的图片就直接加载了，请问如何解决隐藏div的图片和其他图片一样到达位置才加载（或者鼠标经过隐藏div，显示div后再把图片的data-src的值赋给src）。

Answer 1

隐藏 div 中的那些图片的真实 src 也是写在 data-src 里的是么？那在页面载入的适合应该不会自动加载呀。

话说对于隐藏的内容，在未显示之前可以根本不用管他们。总会有一个触发机制让隐藏的内容显示出来，你在触发的时候再根据情况加载即可。

如一个二级菜单里的图片，那么当二级菜单触发显示出来的时候，你再去加载图片即可。