本文主要是介绍jq判断一个元素是否在可视范围内，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
场景重现
比如视频在页面中播放，当用户向下滚动页面时，假如视频元素不可见了，那么我们应该停止播放
相似的场景还有图片懒加载
简单思路
$(() => {// 只要将当前元素相对于窗口的高度+当前元素自身的高度和窗口的滚动距离做对比即可(注意要根据情况而定，对比参照物不一定是窗口，还有可能是父级div)setInterval(() => {console.log($('p').offset().top+$('p').outerHeight() > $(window).scrollTop())// true-可见 false-不可见}, 1000)
})具体实现
- 确定对比参照物(比如是window)
- 监听对比参照物的scroll事件
- 对scroll事件进行函数节流和去抖
- 根据对比结果做出相应的回调
js函数去抖和节流示例
这篇关于jq判断一个元素是否在可视范围内的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
