윈도우즈8 터치 중심의 사이트 구축에 대한 지침 정보
윈도우즈8 터치 중심의 사이트 구축에 대한 지침
본문
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;
}
이 구성을 사용할 경우 사용자는 두 번 탭하여 캔버스 요소로 확대할 수 있지만 게임 요소를 손가락으로 살짝 밀면 페이지가 이동하는 대신 캔버스로 이벤트가 전송됩니다.
이젠 외부 입력 장치에 신경도 써야하는군요..
추천
0
0
댓글 3개

표준구현은 어디로 가고 맨날 CSS 브라우저별 삽질이니;; 켕~

시간아 멈추어다오~~~ 어째 날이 갈수록 빡쎄지네요. ㅠ

살기 힘드네.제길.