IntersectionObserver Class

Observes the intersections of elements with an intersection root (https://w3c.github.io/IntersectionObserver/#intersection-observer-interface): an element or a document, or the viewport of the top-level browsing context (the implicit root). The intersections are computed by the rendering steps of the event loop, after the layout ("run the update intersection observations steps", https://html.spec.whatwg.org/multipage/webappapis.html#update-the-rendering), and the entries are delivered by a task, so only the elements of the documents of a BrowsingContext intersect.

public sealed class IntersectionObserver

Constructors

NameDescription
IntersectionObserver(IntersectionObserverCallback, IntersectionObserverInit?)Creates an observer (https://w3c.github.io/IntersectionObserver/#initialize-a-new-intersectionobserver). The observer belongs to the associated document of the current global object (the time of its entries is relative to its time origin, and its notifications are delivered by a task of its event loop), or, without a current global object, to the document of the root or of the first observed element.

IntersectionObserver(IntersectionObserverCallback, IntersectionObserverInit?)

IntersectionObserver.cs

Creates an observer (https://w3c.github.io/IntersectionObserver/#initialize-a-new-intersectionobserver). The observer belongs to the associated document of the current global object (the time of its entries is relative to its time origin, and its notifications are delivered by a task of its event loop), or, without a current global object, to the document of the root or of the first observed element.

public IntersectionObserver(IntersectionObserverCallback callback, IntersectionObserverInit? options = null)

Parameters

callback IntersectionObserverCallback
The callback invoked with the entries.
options IntersectionObserverInit?
The options.

Exceptions

DomException
A margin cannot be parsed (SyntaxError).
RangeErrorException
A threshold is not between 0 and 1.

See also

Properties

NameDescription
DelayGets the minimum delay in milliseconds between the notifications of a target (at least 100 when the visibility is tracked).
RootGets the intersection root: an Element or a Document, or null for the implicit root.
RootMarginGets the root margin, serialized as four space-separated lengths (pixels) or percentages.
ScrollMarginGets the scroll margin, serialized as four space-separated lengths (pixels) or percentages.
ThresholdsGets the thresholds, in increasing order.
TrackVisibilityGets whether the observer tracks the visibility of the targets.

Gets the minimum delay in milliseconds between the notifications of a target (at least 100 when the visibility is tracked).

public int Delay { get; }

Gets the intersection root: an Element or a Document, or null for the implicit root.

public Node? Root { get; }

Gets the root margin, serialized as four space-separated lengths (pixels) or percentages.

public string RootMargin { get; }

Gets the scroll margin, serialized as four space-separated lengths (pixels) or percentages.

public string ScrollMargin { get; }

Gets the thresholds, in increasing order.

public IReadOnlyList<double> Thresholds { get; }

Gets whether the observer tracks the visibility of the targets.

public bool TrackVisibility { get; }

Methods

NameDescription
Disconnect()Stops observing all the elements (https://w3c.github.io/IntersectionObserver/#dom-intersectionobserver-disconnect). As in the browsers, the entries that are queued are not delivered (WPT intersection-observer/disconnect.html).
Observe(Element)Starts observing an element (https://w3c.github.io/IntersectionObserver/#observe-target-element).
TakeRecords()Returns the queued entries and clears them (https://w3c.github.io/IntersectionObserver/#dom-intersectionobserver-takerecords).
Unobserve(Element)Stops observing an element (https://w3c.github.io/IntersectionObserver/#unobserve-target-element).

Stops observing all the elements (https://w3c.github.io/IntersectionObserver/#dom-intersectionobserver-disconnect). As in the browsers, the entries that are queued are not delivered (WPT intersection-observer/disconnect.html).

public void Disconnect()

Observe(Element)

IntersectionObserver.cs

Starts observing an element (https://w3c.github.io/IntersectionObserver/#observe-target-element).

public void Observe(Element target)

Returns the queued entries and clears them (https://w3c.github.io/IntersectionObserver/#dom-intersectionobserver-takerecords).

Unobserve(Element)

IntersectionObserver.cs

Stops observing an element (https://w3c.github.io/IntersectionObserver/#unobserve-target-element).

public void Unobserve(Element target)