Want to share your CSS expertise with others? Apply to the MDN Fellowship by April 1! http://mzl.la/MDNFellowship

mozilla
Your Search Results

    touch-action

    This article is in need of a technical review.

    この記事はまだ日本語に翻訳されていません。MDN の翻訳はボランティアによって行われています。是非 MDN に登録し、私たちの力になって下さい。

    This is an experimental technology
    Because this technology's specification has not stabilized, check the compatibility table for the proper prefixes to use 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 spec changes.

    Summary

    The touch-action CSS property specifies whether and how a given region can be manipulated by the user (for instance, by panning or zooming).

    • Initial value auto
    • Applies to all elements except: non-replaced inline elements, table rows, row groups, table columns, and column groups
    • Inherited no
    • Media visual
    • Computed value as specified
    • Animatable no
    • Canonical order the unique non-ambiguous order defined by the formal grammar

    Syntax

    Formal syntax:  auto | none | [ pan-x || pan-y ] | manipulation

    Values

    auto
    The user agent may determine any permitted touch behaviors, such as panning and zooming manipulations of the viewport, for touches that begin on the element.
    none
    Touches that begin on the element must not trigger default touch behaviors.
    pan-x
    The user agent may consider touches that begin on the element only for the purposes of horizontally scrolling the element's nearest ancestor with horizontally scrollable content.
    pan-y
    The user agent may consider touches that begin on the element only for the purposes of vertically scrolling the element's nearest ancestor with vertically scrollable content.
    manipulation
    The user agent may consider touches that begin on the element only for the purposes of scrolling and continuous zooming. Any additional behaviors supported by auto are out of scope for this specification.

    Example

    .list {
      width: 200px;
      height: 50px;
      overflow-x: scroll;
    }
    
    .list > .entry {
      touch-action: pan-x;
    }
    

    Specifications

    Specification Status Comment
    Pointer Events
    The definition of 'touch-action' in that specification.
    Recommendation Initial specification

    Browser compatibility

    Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
    Basic support 36.0 Not supported[1] 10.0-ms[2]
    11.0
    26.0 Unimplemented (see WebKit bug 133112)
    Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
    Basic support 37.0 Not supported[1] Not supported Not supported Unimplemented (see WebKit bug 133112)

    [1] Since Firefox 29, support in Firefox is hidden behind the layout.css.touch_action.enabled preference (bug 960316).

    [2] IE10+ additionally supports the non-standard values pinch-zoom, double-tap-zoom, cross-slide-x and cross-slide-y.

    ドキュメントのタグと貢献者

    Contributors to this page: mkato, jithin0001, Sebastianz, teoli
    最終更新者: mkato,