테스트 사이트 - 개발 중인 베타 버전입니다

윈도우즈8 터치 중심의 사이트 구축에 대한 지침

· 13년 전 · 1912 · 3
Windows 8 Consumer Preview의 IE10은 웹에서 빠르고 유연한 멀티 터치 경험을 지원합니다. IE10에서 구동되는 대부분의 사이트는 별도의 변경 없이도 우수한 터치 경험을 지원합니다. 이 글에서는 터치 기능을 사용하는 고객이 여러분의 사이트를 '가장 효과적으로' 사용할 수 있도록 하기 위한 간단한 지침을 제공합니다.
 

브라우저에서 사이트와 원활하게 작동하는 기본 터치 동작을 구성하십시오.

사용자는 터치를 사용하여 사이트를 이동하고 확대/축소할 수 있어야 합니다. 따라서 브라우저는 터치 이동, 손가락 모으기 및 두 번 탭을 기본적으로 사용하며 이러한 상호 작용에 대한 이벤트를 보내지 않습니다. 사이트에서 이러한 상호 작용에 대한 특정 기능을 제공해야 하는 경우 원하는 기본 동작(있을 경우)만 제공하도록 IE10을 구성해야 합니다.
사용자가 요소를 터치하면 -ms-touch-action CSS 속성에 따라 IE10에서 제공하는 기본 동작이 결정됩니다.
 
-ms-touch-action: auto | none | manipulation | double-tap-zoom | inherit;
 
아래 표에 다섯 가지 가능한 값이 나와 있습니다.
설명
auto 브라우저가 요소의 동작을 결정합니다. 이는 -ms-touch-action의 기본값입니다.
none 허용되는 기본 동작이 없습니다.
manipulation 이동, 손가락을 모아서 축소/확대 및 살짝 밀어서 앞/뒤로 이동만 허용됩니다.
double-tap-zoom 두 번 탭하여 확대/축소만 허용됩니다.
inherit 요소가 해당 상위 요소에서 -ms-touch-action 값을 상속합니다.
예를 들어 캔버스 그리기 응용 프로그램에서는 다음을 사용할 수 있습니다.
 
canvas {
-ms-touch-action: double-tap-zoom;
}
 
이 구성을 사용할 경우 사용자는 두 번 탭하여 캔버스 요소로 확대할 수 있지만 게임 요소를 손가락으로 살짝 밀면 페이지가 이동하는 대신 캔버스로 이벤트가 전송됩니다.
 
이젠 외부 입력 장치에 신경도 써야하는군요..

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 3개

13년 전
표준구현은 어디로 가고 맨날 CSS 브라우저별 삽질이니;; 켕~
13년 전
시간아 멈추어다오~~~ 어째 날이 갈수록 빡쎄지네요. ㅠ
13년 전
살기 힘드네.제길.

게시글 목록

번호 제목
1717252
1717247
1717243
1717237
1717225
1717214
1717208
1717203
1717189
1717183
1717177
1717172
1717163
1717162
1717156
1717154
1717153
1717141
1717140
1717138
1717113
1717111
1717105
1717099
1717085
1717076
1717072
1717065
1717062
1717050