[JavaScript] touch-action

!markdown

 

# JavaScript - Chrome

 

전에 만들어 놓은 라이브러리가 먹통이 되어서.. 이것저것 알아보았다.

 

 

 

### Chrome Touch Event - scrolling

 

Chrome 56버전부터는 모바일 Touch Event중에 `event.preventDefault();`로 scrolling되는 것을 막지 못한다.

 

Element의 style속성에 `touch-action`의 값을 `none`으로 주면, scrolling을 방지 할 수 있다!

 

### 예제

 

- CSS

```css

Element {

  touch-action:none;

}

```

 

- on JavaScript

```javascript

element.style.touchAction = 'none';

```

 

 

### Reference (참조)

- Disable scrolling when touch moving certain element: [https://stackoverflow.com/questions/16348031/disable-scrolling-when-touch-moving-certain-element](https://stackoverflow.com/questions/16348031/disable-scrolling-when-touch-moving-certain-element)

- Making touch scrolling fast by default: [https://developers.google.com/web/updates/2017/01/scrolling-intervention](https://developers.google.com/web/updates/2017/01/scrolling-intervention)