今日頭條小程序intersectionobserverrelativeto

選擇器字符串。

可選，用來擴展（或收縮）參照節點布局區域的邊界，屬性如下：

IntersectionObserver對象實例。

請使用字節宿主APP掃碼

開發者工具中預覽

TTML

<scroll-view id="sv" scroll-y style="background:#eee; height: 300px">  <view id="target" style="margin:300px auto; width: 150px; height: 150px; background: lightblue;">  </view></scroll-view>

JavaScript

this.intersectionObserver = tt.createIntersectionObserver(this);// 指定 #sv 作為參照區域this.intersectionObserver.relativeTo("#sv");// 當 #target 節點進入或離開 #sv 節點的可視區域時，則會觸發回調函數this.intersectionObserver.observe("#target", function (res) {  const { intersectionRatio, intersectionRect, boundingClientRect, relativeRect } = res;});