We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
方案一:clientHeight + scrollTop + offsetTop
先给图片一个占位资源,然后通过监听 scroll 事件来判断图片是否到达视口,再给图片设置真实的 src 属性。最好对 scroll 事件做节流处理,以免频繁触发。
src
方案二:getBoundingClientRect
在方案一的基础上换了一种方式来判断图片是否到达视口,使用 imgEle.getBoundingClientRect.top() < clientHeight 来判断。
imgEle.getBoundingClientRect.top() < clientHeight
方案三:IntersectionObserver
这个浏览器 API 实现了监听window的scroll事件、判断观察对象是否在视口中 以及 节流 三大功能。
监听window的scroll事件
判断观察对象是否在视口中
节流
The text was updated successfully, but these errors were encountered:
No branches or pull requests
方案一:clientHeight + scrollTop + offsetTop
先给图片一个占位资源,然后通过监听 scroll 事件来判断图片是否到达视口,再给图片设置真实的
src
属性。最好对 scroll 事件做节流处理,以免频繁触发。方案二:getBoundingClientRect
在方案一的基础上换了一种方式来判断图片是否到达视口,使用
imgEle.getBoundingClientRect.top() < clientHeight
来判断。方案三:IntersectionObserver
这个浏览器 API 实现了
监听window的scroll事件
、判断观察对象是否在视口中
以及节流
三大功能。The text was updated successfully, but these errors were encountered: