MDN wants to talk to developers like you: https://qsurvey.mozilla.com/s3/8d22564490d8

IntersectionObserver.thresholds

Draft
This page is not complete.

This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for usage in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the specification changes.

The IntersectionObserver interface's read-only thresholds property returns the list of intersection thresholds that was specified when the observer was instantiated with IntersectionObserver(). If only one threshold ratio was provided when instanitating the object, this will be an array containing that single value.

See "Thresholds" in Intersection Observer API to learn how thresholds work.

Syntax

var thresholds = IntersectionObserver.thresholds;

Value

An array of intersection thresholds, originally specified using the threshold property when instantiating the observer. If only one observer was speciied, without being in an array, this value is a one-entry array containing that threshold. Regardless of the order your original threshold array was in, this one is always sorted in numerically increasing order.

If no threshold option was included when IntersectionObserver() was used to instantiate the observer, the value of thresholds is simply [0].

Be careful! While the options you specify when creating an IntersectionObserver  has a field named threshold, but this property is called thresholds. Confusing? Yes. If you accidentally use thresholds as the name of the field in your options, the thresholds array will wind up being simply [0.0], which is likely not what you expect. Debugging chaos may ensue.

Examples

<<<...>>>

Specifications

Specification Status Comment
Intersection Observer
The definition of 'IntersectionObserver.thresholds' in that specification.
Editor's Draft Initial definition

Browser compatibility

Feature Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 51.0 (Yes) 55 (55)[1] No support ? ?
Feature Android Android Webview Edge Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile Chrome for Android
Basic support No support 51.0 (Yes) 55.0 (55)[1] No support No support ? ? 51.0

[1] This feature has been implemented since Gecko 53.0 (Firefox 53.0 / Thunderbird 53.0 / SeaMonkey 2.50) behind the preference dom.IntersectionObserver.enabled, which was false by default. Enabled by default beginning in Firefox 55. See bug 1243846.

Document Tags and Contributors

 Contributors to this page: Sheppy
 Last updated by: Sheppy,