12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152 |
- export interface VisibleDomRect {
- bottom: number;
- height: number;
- left: number;
- right: number;
- top: number;
- width: number;
- }
- /**
- * 获取元素可见信息
- * @param element
- */
- export function getElementVisibleRect(
- element?: HTMLElement | null | undefined,
- ): VisibleDomRect {
- if (!element) {
- return {
- bottom: 0,
- height: 0,
- left: 0,
- right: 0,
- top: 0,
- width: 0,
- };
- }
- const rect = element.getBoundingClientRect();
- const viewHeight = Math.max(
- document.documentElement.clientHeight,
- window.innerHeight,
- );
- const top = Math.max(rect.top, 0);
- const bottom = Math.min(rect.bottom, viewHeight);
- const viewWidth = Math.max(
- document.documentElement.clientWidth,
- window.innerWidth,
- );
- const left = Math.max(rect.left, 0);
- const right = Math.min(rect.right, viewWidth);
- return {
- bottom,
- height: Math.max(0, bottom - top),
- left,
- right,
- top,
- width: Math.max(0, right - left),
- };
- }
|