The topic you requested is included in another documentation set. For convenience, it's displayed below. Choose Switch to see the topic in its original location.

-ms-scroll-translation property

Specifies whether vertical-to-horizontal scroll wheel translation occurs on the specified element.

This property is read/write.

Internet Explorer 10



-ms-scroll-translation: vertical-to-horizontal | none | inherit

Property values

One of the following keywords.


Vertical to horizontal translation, as described in Remarks, will take place when appropriate.


No scroll wheel translation takes place.


Initial value. Value is inherited from the element's parent element.

CSS information

Applies ToAll elements
Initial Valueinherit


This property has no effect on non-scrollable elements.

If your JavaScript is listening for scroll wheel Document Object Model (DOM) events, the events that occur when the user scrolls vertically will always be vertical scroll events, not horizontal scroll events. Similarly, the events that occur when the user scrolls horizontally will always be horizontal scroll events. This property enables you to change this behavior for vertical scroll events. By setting the -ms-scroll-translation property to vertical-to-horizontal, you are specifying that vertical scroll events should be interpreted as their corresponding horizontal scroll events.

This property's initial value is inherit on all elements, except the html element, where it defaults to none.

This property has no effect on keyboard interaction.

The default Cascading Style Sheets (CSS) templates for Windows apps using JavaScript, "ui-light.css" and "ui-dark.css", set this property to vertical-to-horizontal by default on the html element.

This property requires Windows 8 or later.

See also

Windows apps using JavaScript Samples: HTML scrolling, panning and zooming sample
Internet Explorer Samples: Scrolling, panning, and zooming with touch input