IntersectionObserver: rootMargin 属性

Baseline 已广泛支持

此功能已成熟,并可在多种设备和浏览器版本上运行。自 2019 年 3 月以来,它已在所有浏览器中可用。

IntersectionObserver 接口的只读属性 rootMargin 是一个字符串,其语法类似于 CSS 的 margin 属性。

在执行交叉测试之前,rootMargin 所代表的矩形的每一边都会被添加到 root 元素的 边界框 的相应边上。例如,这允许你向外调整边界,以便即使目标元素的宽度或高度被裁剪掉一部分像素,它仍被视为 100% 可见;或者,如果某个边缘离根元素边界框的边缘太近,就将其视为部分隐藏。

有关 rootMargin 的更深入的介绍以及它如何与 root 元素的边界框配合使用,请参阅 如何计算交叉

一个字符串,其格式类似于 CSS margin 属性的值,其中包含根元素边界框一个或多个边的偏移量。在计算由此产生的矩形与目标元素边界之间的交叉之前,这些偏移量会被加到根元素边界框的相应值上。

此属性返回的字符串可能与实例化 IntersectionObserver 时指定的字符串不匹配。例如,结果总是包含四个分量,尽管输入可能少于四个。

如果在实例化对象时未指定 rootMargin,则默认为字符串 "0px 0px 0px 0px",这意味着交叉将在未修改的根元素边界矩形和目标边界之间进行计算。 如何计算交叉 详细描述了 rootMargin 的使用方式。

规范

规范
交集观察器
# dom-intersectionobserver-rootmargin

浏览器兼容性