JavaScript Element scrollTopMax Property

Beginner
5 min read
Updated: Nov 2026
3 examples
Property
Decorative image with the word SCROLLTOPMAX

Definition

Element.scrollTopMax is a read-only number: the maximum top scroll offset possible for the element (MDN). Where supported, it is the largest value scrollTop can normally reach.

Read the notes below before you get or set this property. Prefer feature detection when support is limited.

Syntax

Use el.scrollTopMax. Start with this line.

JavaScript
element.scrollTopMax
CallWhat it does
element.scrollTopMaxPrimary signature.

Built into the browser. Read or assign el.scrollTopMax — no import required.

Library declarations
JavaScript
element.scrollTopMax

Parameters

ParameterDescription
Scroll containerRequired. Element that can scroll vertically
scrollHeight / clientHeightRequired. Standard way to compute the max
scrollTopMaxOptional. Firefox helper — feature-detect only

Return Value

Return ValueDescription
*Number (max top scroll offset)

JavaScript Examples

Example 1 — Portable Max

Compute the maximum vertical offset with standard properties.

JavaScript
const box = document.getElementById("box");
// fixed height + tall content

const maxTop = box.scrollHeight - box.clientHeight;
console.log(maxTop);  // e.g. 160
Try It Yourself

How It Works

  1. Full height. scrollHeight is the content height including overflow.
  2. Visible height. clientHeight is the inner viewport of the box.
  3. Subtract. The difference is how far you can scroll vertically.
  4. Portable. Works in modern browsers without scrollTopMax.

Example 2 — Feature-Detect

Read the non-standard property only when it exists.

JavaScript
const box = document.getElementById("box");

const supported = "scrollTopMax" in box;
const maxTop = supported
  ? box.scrollTopMax
  : box.scrollHeight - box.clientHeight;

console.log(supported, maxTop);
Try It Yourself

How It Works

  1. Check first. "scrollTopMax" in box avoids relying on a missing API.
  2. Native path. If present (often Firefox), use the read-only helper.
  3. Fallback. Otherwise use scrollHeight - clientHeight.
  4. Same goal. Both paths aim for the maximum vertical offset.

Example 3 — Scroll to Bottom

Jump to the maximum vertical position using the portable max.

JavaScript
const box = document.getElementById("box");

const maxTop = box.scrollHeight - box.clientHeight;
box.scrollTop = maxTop;

console.log(box.scrollTop);  // near maxTop
Try It Yourself

How It Works

  1. Compute the max. Use the portable height difference.
  2. Assign. Set scrollTop to that value.
  3. Result. The box jumps near the bottom of the content.
  4. Note. You assign to scrollTop, never to scrollTopMax.
Compatibility

Browser Support

Element.scrollTopMax is marked Non-standard on MDN and is not part of any specification. Support is limited (mainly Firefox). Prefer scrollHeight - clientHeight for portable code.

✓ Non-standard · Limited

Element.scrollTopMax

Read-only maximum vertical scroll offset — Firefox-oriented, not for production cross-browser use.

Limited Non-standard
Mozilla Firefox Supported (non-standard)
Yes
Google Chrome Not available — use scrollHeight - clientHeight
No
Microsoft Edge Not available — use scrollHeight - clientHeight
No
Apple Safari Not available — use scrollHeight - clientHeight
No
Opera Not available — use scrollHeight - clientHeight
No
Internet Explorer Not available
No
scrollTopMax Limited

Bottom line: Feature-detect if you inspect scrollTopMax in Firefox. For shipping UI, use scrollHeight - clientHeight.

Frequently Asked Questions

Where supported, it returns a read-only number: the maximum top scroll offset possible for the element — the largest value scrollTop can normally reach.
MDN marks Element.scrollTopMax as Non-standard. It is not part of any specification. It is not labeled Deprecated or Experimental, but MDN does not recommend non-standard features for production.
Support is limited — mainly Firefox. Chrome, Safari, and Edge typically do not expose scrollTopMax.
Prefer the portable calculation element.scrollHeight - element.clientHeight for the maximum vertical scroll offset across browsers.
No. It is read-only. Read the maximum, then assign to scrollTop if you want to move the scrollbar.
scrollTop is the current vertical offset and is writable. scrollTopMax is the maximum possible offset and is read-only (where supported).

Next: scrollWidth

Learn how to read an element’s full scrollable content width.

scrollWidth tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

11 people found this page helpful

JavaScript Element scrollTop Property JavaScript Element scrollWidth Property