HTML 检测元素能显示出来的比例

// 检测元素能显示出来的比例
const visibleProportion = (element: HTMLElement) => {
//获取获取某个元素相对于视窗的位置集合
const rect = element.getBoundingClientRect();
//获取要素高度
const clientHeight = document.documentElement.clientHeight;
const top = Math.min(clientHeight, Math.max(rect.top, 0));
const bottom = Math.max(0, Math.min(rect.top + rect.height, clientHeight));
return (bottom - top) / rect.height;
}

//调用该方法
if (visibleProportion(element) < .8) {
// 视频显示出来的比例不足 80% 时暂停播放
//current.player.pause();
} else if (current.state.playing) {
return;
}