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).

Initialwert	`auto`
Anwendbar auf	alle Elemente außer: nicht ersetzte Inlineelemente, Tabellenzeilen, Zeilengruppen, Tabellenspalten und Spaltengruppen
Vererbt	Nein
Medien	visuell
Berechneter Wert	wie angegeben
Animationstyp	diskret
Kanonische Reihenfolge	die 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

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android Webview	Chrome für Android	Firefox für Android	Opera für Android	Safari auf iOS	Samsung Internet
`touch-action`	Chrome Vollständige Unterstützung 36	Edge Vollständige Unterstützung 12	Firefox 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 23	Safari Vollständige Unterstützung 13	WebView Android Vollständige Unterstützung 37	Chrome Android Vollständige Unterstützung 36	Firefox 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 Ja	Safari iOS Vollständige Unterstützung 9.3	Samsung Internet Android Vollständige Unterstützung 3.0
`pan-x` and `pan-y`	Chrome Vollständige Unterstützung 36	Edge Vollständige Unterstützung 12	Firefox 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 23	Safari Vollständige Unterstützung 13	WebView Android Vollständige Unterstützung 37	Chrome Android Vollständige Unterstützung 36	Firefox 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 Ja	Safari iOS Vollständige Unterstützung 13	Samsung Internet Android Vollständige Unterstützung 3.0
`double-tap-zoom` Nicht standardisiert	Chrome Keine Unterstützung Nein	Edge Vollständige Unterstützung 12	Firefox Keine Unterstützung Nein	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 Keine Unterstützung Nein	Safari Keine Unterstützung Nein	WebView Android Keine Unterstützung Nein	Chrome Android Keine Unterstützung Nein	Firefox Android Keine Unterstützung Nein	Opera Android Keine Unterstützung Nein	Safari iOS Keine Unterstützung Nein	Samsung Internet Android Keine Unterstützung Nein
`manipulation`	Chrome Vollständige Unterstützung 36	Edge Vollständige Unterstützung 12	Firefox 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 23	Safari Vollständige Unterstützung 13	WebView Android Vollständige Unterstützung 37	Chrome Android Vollständige Unterstützung 36	Firefox 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 Ja	Safari iOS Vollständige Unterstützung 9.3	Samsung Internet Android Vollständige Unterstützung 3.0
`none`	Chrome Vollständige Unterstützung 36	Edge Vollständige Unterstützung 12	Firefox 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 23	Safari Vollständige Unterstützung 13	WebView Android Vollständige Unterstützung 37	Chrome Android Vollständige Unterstützung 36	Firefox 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 Ja	Safari iOS Vollständige Unterstützung 13	Samsung Internet Android Vollständige Unterstützung 3.0
`pinch-zoom`	Chrome Vollständige Unterstützung 56	Edge Vollständige Unterstützung 12	Firefox 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 43	Safari Vollständige Unterstützung 13	WebView Android Vollständige Unterstützung 56	Chrome Android Vollständige Unterstützung 56	Firefox Android Keine Unterstützung Nein Hinweise Keine Unterstützung Nein Hinweise Hinweise See bug 1285685.	Opera Android Vollständige Unterstützung 43	Safari iOS Vollständige Unterstützung 13	Samsung Internet Android Vollständige Unterstützung 6.0
`pan-up`, `pan-down`, `pan-left` and `pan-right`	Chrome Vollständige Unterstützung 55	Edge Keine Unterstützung Nein	Firefox Keine Unterstützung Nein Hinweise Keine Unterstützung Nein Hinweise Hinweise See bug 1285685.	IE Keine Unterstützung Nein	Opera Vollständige Unterstützung 42	Safari Keine Unterstützung Nein	WebView Android Vollständige Unterstützung 55	Chrome Android Vollständige Unterstützung 55	Firefox Android Keine Unterstützung Nein Hinweise Keine Unterstützung Nein Hinweise Hinweise See bug 1285685.	Opera Android Vollständige Unterstützung 42	Safari iOS Keine Unterstützung Nein	Samsung Internet Android Vollständige Unterstützung 6.0

Legende

Vollständige Unterstützung: Vollständige Unterstützung
Keine Unterstützung: Keine Unterstützung
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.