touch-action सीएसएस प्रॉपर्टी की मदद से डेवलपर यह तय कर सकता है कि कोई उपयोगकर्ता,
किसी ऐसे एलिमेंट के साथ कैसे इंटरैक्ट कर सकता है जो ज़रूरी न होने पर, इवेंट को
भेजे जाने से रोकने में खास तौर पर मददगार है.
वर्शन 55 से पहले, Chrome में pan-x और pan-y काम करते थे. यह एलिमेंट को एक ही दिशा में स्क्रोल करने से रोकता है.
नीचे दिए गए वीडियो में एक ऐसे एलिमेंट का उदाहरण दिखाया गया है जिसमें टच-ऐक्शन (बाएं) नहीं किया गया है. साथ ही, पैन-x और पैन-y (बीच और दाईं ओर) का उदाहरण भी दिखाया गया है.
बीच और दाएं हाथ के स्क्रीन-कास्ट के लिए सीएसएस:
.pan-x {
touch-action: pan-x;
}
.pan-y {
touch-action: pan-y;
}
Chrome 55 में, pan-left, pan-right, pan-up, और pan-down को जोड़ा गया था. इन प्रॉपर्टी के व्यवहार में बेहद मामूली, लेकिन अहम अंतर होता है.
ये प्रॉपर्टी, उपयोगकर्ता को एलिमेंट के जवाब देने से पहले एक दिशा में हाथ के जेस्चर (हाव-भाव) शुरू करने के लिए मजबूर करती हैं. यह "पुल-टू-रीफ्रेश" जेस्चर जैसा ही है, जो सिर्फ़ तब जवाब देता है, जब उपयोगकर्ता स्क्रीन पर नीचे की ओर हाथ के जेस्चर करता है.
नीचे दिए गए वीडियो में pan-right और pan-down के बारे में बताया गया है. इनके लिए,
दाएं से बाएं और नीचे से ऊपर की ओर जेस्चर की ज़रूरत होती है.
जेस्चर शुरू होने के बाद, आप वास्तव में
आगे और पीछे पैन कर सकते हैं. इसका असर सिर्फ़ शुरुआती दिशा में होता है.
हालांकि, वीडियो में इस तरीके के बारे में बताया गया है, फिर भी हो सकता है कि आप इसे खुद आज़मा लें. सैंपल की जांच करके ऐसा किया जा सकता है.
इस डेमो का सीएसएस यह है:
.pan-right {
touch-action: pan-right;
}
.pan-down {
touch-action: pan-down;
}
टच-ऐक्शन की दुनिया में, सबसे आखिरी चीज़ pinch-zoom प्रॉपर्टी है. यह Chrome 55 में मौजूद एक नई प्रॉपर्टी है, जिसके पीछे फ़्लैग है.
इसका इस्तेमाल पैन के किसी भी विकल्प (जैसे, pan-x, pan-y, pan-left, pan-right, pan-down, pan-up) के साथ किया जा सकता है.
अगर किसी वेबसाइट पर पिंच किया जाता है, तो वह आम तौर पर पेजों के कॉन्टेंट को ज़ूम इन करेगी.
touch-action को तय करने पर यह तरीका काम नहीं करेगा. हालांकि, पिंच-ज़ूम करने से यह सुविधा फिर से चालू हो जाएगी.
इस वीडियो में, touch-action: pan-x और
touch-action: pan-x pinch-zoom के बीच का अंतर दिखाया गया है;
इन सभी प्रॉपर्टी को कुछ लॉजिक को आसान बनाना चाहिए, ताकि
pointer-events का इस्तेमाल करने वाले डेवलपर को इसे लागू करना पड़े.