此问题针对的是https://res.zhen.com/mzhenpin/statics/js/lazyLoad.js 公司封装的懒加载js;
使用时栗子:
<img class="ui-imglazyload" data-url="https://template.jpg">
点击对应模块滚动之后,会往下面移动部分。
menu.saveimg.savepath20181018103346.jpg
由于没有加载图片的时候,图片高度就是宽度的正方形。所以造成了图片父元素的高度被撑开,在点击导航栏,滚动到指定位置之后,由于触发懒加载,图片展示实际的高度。此时,图片父元素的高度会恢复原来实际高度。会使得滚动到的距离发生变化。
11111.png
chrome的处理时,高度变化时,滚动距离也随着高度变化而变化。所以滚动的距离是正确的。
但是用Firefox和Safari测试的时候,高度变化,滚动距离不会发生变化,最终的效果就是实际要滚动的地方到可是区域下面去了。
要处理这种情况,目前发现只有把需要懒加载的图片高度给设置好。这样,就不会存在滚动位置不对的问题了。