jQueryScript Demo Page

jQuery Mouse Wheel Demos

Download This Plugin Back To jQueryScript

Scroll inside each surface to inspect normalized movement, map two-axis input, scrub a horizontal sequence, and control event propagation.

Move your cursor into a demo and scroll
01

Live vector field

Use a wheel or trackpad in any direction. The marker follows the input while the event values update in real time.

North East South West

Scroll anywhere in this field

Primary delta 0
Direction Idle
Normalized X 0
Normalized Y 0
Delta factor 0 px
Reported distance 0 px
Pointer offset 0, 0
02

Horizontal scrub rail

Vertical wheel movement becomes precise horizontal travel. Native page scrolling pauses while the cursor is over the rail.

Frame 01

Begin at the origin

Frame 02

Read input force

Frame 03

Preserve direction

Frame 04

Translate distance

Frame 05

Reach the edge

Position 0 px Last input 0 px
03

Propagation chamber

Switch between a bubbling event and an isolated child event, then scroll inside either surface to compare the counters.

Child surface

Scroll inside this circle