touch-action

Dies ist eine experimentelle Technologie
Da diese Technologie noch nicht definitiv implementiert wurde, sollte die Browserkompatibilität beachtet werden. Es ist auch möglich, dass die Syntax in einer späteren Spezifikation noch geändert wird.

Übersicht

Die CSS-Eigenschaft touch-action spezifiziert, ob das Standardverhalten des Browsers ausgeführt wird oder nicht (z. B. durch Scrollen oder Zoomen).

Initialwertauto
Anwendbar aufalle Elemente außer: nicht ersetzte Inlineelemente, Tabellenzeilen, Zeilengruppen, Tabellenspalten und Spaltengruppen
VererbtNein
Medienvisuell
Berechneter Wertwie angegeben
Animationstypdiskret
Kanonische Reihenfolgedie eindeutige Reihenfolge definiert durch die formale Grammatik

Syntax

auto | none | [ [ pan-x | pan-left | pan-right ] || [ pan-y | pan-up | pan-down ] || pinch-zoom ] | manipulation

Werte

auto
Der User-Agent führt das voreingestellte Verhalten für Berührungen aus, wie die Manipulation des Elements durch Scrollen oder Zoomen bei Berührungen, die in dem Element beginnen.
none
Berührungen, die auf dem Element beginnen, lösen nicht das Standardverhalten aus.
pan-x
Der User-Agent reagiert nur auf Berührungen, die das horizontale Scrollen des nächsten scrollbaren Elements auslösen.
pan-y
Der User-Agent reagiert nur auf Berührungen, die das vertikale Scrollen des nächsten scrollbaren Elements auslösen.
manipulation
Der User-Agent reagiert nur auf Berührungen, die dem Scrollen oder dem ununterbrochenen Zoomen dienen.

Beispiel

.list {
  width: 200px;
  height: 50px;
  overflow-x: scroll;
}

.list > .entry {
  touch-action: pan-x;
}

Spezifikationen

Spezifikation Status Anmerkung
Pointer Events
Die Definition von 'touch-action' in dieser Spezifikation.
Veraltet  

Browser Kompatibilität

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid WebviewChrome für AndroidFirefox für AndroidOpera für AndroidSafari auf iOSSamsung Internet
touch-actionChrome Vollständige Unterstützung 36Edge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 52
Hinweise
Vollständige Unterstützung 52
Hinweise
Hinweise Not applicable to Firefox platforms that support neither pointer nor touch events.
Vollständige Unterstützung 29
Hinweise Deaktiviert
Hinweise Not applicable to Firefox platforms that support neither pointer nor touch events.
Deaktiviert From version 29: this feature is behind the layout.css.touch_action.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Vollständige Unterstützung 11
Vollständige Unterstützung 11
Vollständige Unterstützung 10
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -ms-
Opera Vollständige Unterstützung 23Safari Vollständige Unterstützung 13WebView Android Vollständige Unterstützung 37Chrome Android Vollständige Unterstützung 36Firefox Android Vollständige Unterstützung 52
Vollständige Unterstützung 52
Vollständige Unterstützung 29
Deaktiviert
Deaktiviert From version 29: this feature is behind the layout.css.touch_action.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung 9.3Samsung Internet Android Vollständige Unterstützung Ja
pan-x and pan-yChrome Vollständige Unterstützung 36Edge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 52
Hinweise
Vollständige Unterstützung 52
Hinweise
Hinweise Not applicable to Firefox platforms that support neither pointer nor touch events.
Vollständige Unterstützung 29
Hinweise Deaktiviert
Hinweise Not applicable to Firefox platforms that support neither pointer nor touch events.
Deaktiviert From version 29: this feature is behind the layout.css.touch_action.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Vollständige Unterstützung 11
Vollständige Unterstützung 11
Vollständige Unterstützung 10
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -ms-
Opera Vollständige Unterstützung 23Safari Vollständige Unterstützung 13WebView Android Vollständige Unterstützung 37Chrome Android Vollständige Unterstützung 36Firefox Android Vollständige Unterstützung 52
Vollständige Unterstützung 52
Vollständige Unterstützung 29
Deaktiviert
Deaktiviert From version 29: this feature is behind the layout.css.touch_action.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung 13Samsung Internet Android Vollständige Unterstützung Ja
double-tap-zoom
Nicht standardisiert
Chrome Keine Unterstützung NeinEdge Vollständige Unterstützung 12Firefox Keine Unterstützung NeinIE Vollständige Unterstützung 11
Vollständige Unterstützung 11
Vollständige Unterstützung 10
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -ms-
Opera Keine Unterstützung NeinSafari Keine Unterstützung NeinWebView Android Keine Unterstützung NeinChrome Android Keine Unterstützung NeinFirefox Android Keine Unterstützung NeinOpera Android Keine Unterstützung NeinSafari iOS Keine Unterstützung NeinSamsung Internet Android Keine Unterstützung Nein
manipulationChrome Vollständige Unterstützung 36Edge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 52
Hinweise
Vollständige Unterstützung 52
Hinweise
Hinweise Not applicable to Firefox platforms that support neither pointer nor touch events.
Vollständige Unterstützung 29
Hinweise Deaktiviert
Hinweise Not applicable to Firefox platforms that support neither pointer nor touch events.
Deaktiviert From version 29: this feature is behind the layout.css.touch_action.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Vollständige Unterstützung 11
Vollständige Unterstützung 11
Vollständige Unterstützung 10
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -ms-
Opera Vollständige Unterstützung 23Safari Vollständige Unterstützung 13WebView Android Vollständige Unterstützung 37Chrome Android Vollständige Unterstützung 36Firefox Android Vollständige Unterstützung 52
Vollständige Unterstützung 52
Vollständige Unterstützung 29
Deaktiviert
Deaktiviert From version 29: this feature is behind the layout.css.touch_action.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung 9.3Samsung Internet Android Vollständige Unterstützung Ja
noneChrome Vollständige Unterstützung 36Edge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 52
Hinweise
Vollständige Unterstützung 52
Hinweise
Hinweise Not applicable to Firefox platforms that support neither pointer nor touch events.
Vollständige Unterstützung 29
Hinweise Deaktiviert
Hinweise Not applicable to Firefox platforms that support neither pointer nor touch events.
Deaktiviert From version 29: this feature is behind the layout.css.touch_action.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Vollständige Unterstützung 11
Vollständige Unterstützung 11
Vollständige Unterstützung 10
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -ms-
Opera Vollständige Unterstützung 23Safari Vollständige Unterstützung 13WebView Android Vollständige Unterstützung 37Chrome Android Vollständige Unterstützung 36Firefox Android Vollständige Unterstützung 52
Vollständige Unterstützung 52
Vollständige Unterstützung 29
Deaktiviert
Deaktiviert From version 29: this feature is behind the layout.css.touch_action.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung 13Samsung Internet Android Vollständige Unterstützung Ja
pinch-zoomChrome Vollständige Unterstützung 56Edge Vollständige Unterstützung 12Firefox Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 1285685.
IE Vollständige Unterstützung 11
Vollständige Unterstützung 11
Vollständige Unterstützung 10
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -ms-
Opera Vollständige Unterstützung 43Safari Vollständige Unterstützung 13WebView Android Vollständige Unterstützung 56Chrome Android Vollständige Unterstützung 56Firefox Android Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 1285685.
Opera Android Vollständige Unterstützung 43Safari iOS Vollständige Unterstützung 13Samsung Internet Android Vollständige Unterstützung 6.0
pan-up, pan-down, pan-left and pan-right
Experimentell
Chrome Vollständige Unterstützung 55Edge Keine Unterstützung NeinFirefox Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 1285685.
IE Keine Unterstützung NeinOpera Vollständige Unterstützung 42Safari Keine Unterstützung NeinWebView Android Vollständige Unterstützung 55Chrome Android Vollständige Unterstützung 55Firefox Android Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 1285685.
Opera Android Vollständige Unterstützung 42Safari iOS Keine Unterstützung NeinSamsung Internet Android Vollständige Unterstützung 6.0

Legende

Vollständige Unterstützung  
Vollständige Unterstützung
Keine Unterstützung  
Keine Unterstützung
Experimentell. Das Verhalten kann sich zukünftig ändern.
Experimentell. Das Verhalten kann sich zukünftig ändern.
Nicht standardisiert. Erwarte schlechte browserübergreifende Unterstützung.
Nicht standardisiert. Erwarte schlechte browserübergreifende Unterstützung.
Siehe Implementierungshinweise.
Siehe Implementierungshinweise.
Benutzer muss dieses Feature explizit aktivieren.
Benutzer muss dieses Feature explizit aktivieren.
Benötigt ein Herstellerpräfix oder einen anderen Namen zur Verwendung.
Benötigt ein Herstellerpräfix oder einen anderen Namen zur Verwendung.