Touch-action for what? CSS

Asked

Viewed 1,735 times

1

I’m getting a warning on the console of Google Chrome:

[Intervention] Unable to preventDefault Inside Passive EventListener due to target being treated as Passive. See https://www.chromestatus.com/features/5093566007214080 and @ 332526c6e8d3fc1326ad773f97b0a486.js:5029 Dispatch @ 332526c6e8d3fc1326ad773f97b0a486.js:583 r. Handle @ 332526c6e8d3fc1326ad773f97b0a486.js:583

Using the touch-action: none; in the body of mine website, this warning no longer appears.

  1. Would you like to know why the warning? and
  2. what the touch-action: none; does to remove the same?
css css3 google-chrome
  • 1

    About the touch-action:none vc can read more here: https://developer.mozilla.org/en-US/docs/Web/CSS/touch-action from what I understand it disables all screen Touch functions (pan and zoom).

  • 1

    About the "bug" here is another reference, see from item 2.5 to 2.7 https://dom.spec.whatwg.org/#Defining-Event-interfaces something else, some versions of Firefox vc have to enable Flag layout.css.touch_action.enabled reference: https://developer.mozilla.org/en-US/Firefox/Experimental_features

1 answer

2

The estate touch-action allows you to decide what will be the ringing behavior of that item on sensitive devices, for example:

/* Keyword values */
touch-action: auto;
touch-action: none;
touch-action: pan-x;
touch-action: pan-left;
touch-action: pan-right;
touch-action: pan-y;
touch-action: pan-up;
touch-action: pan-down;
touch-action: pinch-zoom;
touch-action: manipulation;

/* Global values */
touch-action: inherit;
touch-action: initial;
touch-action: unset;

These are the possible values that the touch-action may have.

As a partial answer to your question touch-action:none disables all "tweezers" and zoom gestures the user performs.

Source on the touch-action: https://developer.mozilla.org/en-US/docs/Web/CSS/touch-action

Browser other questions tagged css css3 google-chrome

You are not signed in. Login or sign up in order to post.