JavaScript MouseEvent webkitForceAtForceMouseDown Property

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

Definition

A proprietary WebKit static number on MouseEvent: the minimum force needed for a force click (MDN). Always read MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN — not on an event instance.

Read the notes below before you rely on this property. Prefer feature detection when support is limited.

Syntax

Use event.webkitForceAtForceMouseDown. Start with this line.

JavaScript
MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN
CallWhat it does
MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWNPrimary signature.

Built into the browser. Read event.webkitForceAtForceMouseDown on a MouseEvent — no import required.

Library declarations
JavaScript
MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN

Parameters

ParameterDescription
Instance?Optional. Not an event property — static only

Return Value

Return ValueDescription
*Number (threshold) when supported

JavaScript Examples

Example 1 — Feature Detect

Never assume the constant exists — check first.

JavaScript
const supported =
  typeof MouseEvent !== "undefined" &&
  "WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN" in MouseEvent;

console.log(supported);
Try It Yourself

How It Works

  1. Confirm MouseEvent exists.
  2. Use in to test for the static name.
  3. Most browsers → false.
  4. Safari/WebKit with Force Touch → may be true.

Example 2 — Read the Threshold

Log the number only when support is present.

JavaScript
if ("WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN" in MouseEvent) {
  console.log(MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN);
} else {
  console.log("unsupported");
}
Try It Yourself

How It Works

  1. Gate on feature detect.
  2. Read the static from MouseEvent.
  3. Value is a number — the force-click floor.
  4. Else print unsupported and skip Force Touch logic.

Example 3 — Static vs Instance

MDN: use the constructor — not event.….

JavaScript
const e = new MouseEvent("mousedown");
console.log("instance", e.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN);
console.log(
  "static",
  "WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN" in MouseEvent
    ? MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN
    : "n/a"
);
Try It Yourself

How It Works

  1. Create any MouseEvent.
  2. Read on the instance — usually undefined.
  3. Read on MouseEvent when supported.
  4. Always prefer the static form.

Example 4 — Two Thresholds

Force-click threshold is higher than normal mouse-down force.

JavaScript
const forceClick =
  "WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN" in MouseEvent
    ? MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN
    : null;
const mouseDown =
  "WEBKIT_FORCE_AT_MOUSE_DOWN" in MouseEvent
    ? MouseEvent.WEBKIT_FORCE_AT_MOUSE_DOWN
    : null;

console.log({ forceClick, mouseDown });
Try It Yourself

How It Works

  1. Detect each static separately.
  2. forceClick — harder press threshold.
  3. mouseDown — lighter normal press threshold.
  4. On WebKit, forceClick is typically larger.

Example 5 — Compare webkitForce

Use the threshold only when both APIs exist.

JavaScript
el.addEventListener("mousedown", (e) => {
  if (!("WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN" in MouseEvent)) {
    console.log("no Force Touch API");
    return;
  }
  const t = MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN;
  console.log(e.webkitForce >= t ? "force click" : "normal");
});
Try It Yourself

How It Works

  1. Exit early if the static is missing.
  2. Read the threshold once.
  3. Compare event.webkitForce to that number.
  4. Fallback to normal click when unsupported.
Compatibility

Browser Support

MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN is marked Non-standard on MDN — not part of any specification. WebKit/Safari Force Touch only.

✓ Non-standard

WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN

Static WebKit threshold for force click. Feature-detect; provide a normal-click fallback. Prefer broader pressure APIs when you need cross-browser support.

— WebKit only
Google Chrome All versions · Desktop & Mobile
Full support
Mozilla Firefox All versions · Desktop & Mobile
Full support
Apple Safari All versions · macOS & iOS
Full support
Microsoft Edge All versions · Chromium & Legacy
Full support
Internet Explorer IE 6+ · Legacy environments
Full support
Opera All modern versions
Full support
Force threshold Limited

Bottom line: Study it for Safari Force Touch demos — do not require it for core UX. See the MDN reference.

Frequently Asked Questions

A proprietary WebKit static numeric property on MouseEvent. Its value is the minimum force needed for a force click (Force Touch). Always read it as MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN, not on an event instance.
MDN marks it Non-standard — not part of any web specification. It is not labeled Deprecated or Experimental on that MDN page, but non-standard APIs should not be relied on in production cross-browser code.
Because it is a static property of the MouseEvent interface. Instance events do not carry this constant; reading event.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN is typically undefined.
MouseEvent.webkitForce reports the current force on a mouse event. Compare that value to WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN to detect a force-click threshold on supporting Safari/WebKit builds.
That related static constant is the minimum force for a normal mouse down (lighter threshold). Force-click uses the higher WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN value.
Only behind feature detection for Safari/WebKit Force Touch experiments. Prefer broader Pointer Events pressure APIs where they fit your product.

Next: WEBKIT_FORCE_AT_MOUSE_DOWN

Learn the lighter WebKit threshold for a normal mouse down.

WEBKIT_FORCE_AT_MOUSE_DOWN →

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)

8 people found this page helpful

JavaScript MouseEvent webkitForce Property JavaScript MouseEvent WEBKIT_FORCE_AT_MOUSE_DOWN Property