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

瀏覽器相容性