윈도우즈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;
}
이 구성을 사용할 경우 사용자는 두 번 탭하여 캔버스 요소로 확대할 수 있지만 게임 요소를 손가락으로 살짝 밀면 페이지가 이동하는 대신 캔버스로 이벤트가 전송됩니다.
이젠 외부 입력 장치에 신경도 써야하는군요..
댓글 3개
게시판 목록
자유게시판
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 199717 | 2일 전 | 3 | ||
| 199716 |
느긋한카키쿠키
|
2일 전 | 2 | |
| 199715 |
현대적인무질서한까마귀
|
2일 전 | 3 | |
| 199714 | 2일 전 | 8 | ||
| 199713 | 3일 전 | 16 | ||
| 199712 | 2주 전 | 244 | ||
| 199711 |
안졸리니졸리니
|
2주 전 | 121 | |
| 199710 |
 glitter0gim |
2주 전 | 134 | |
| 199709 |
glitter0gim |
2주 전 | 76 | |
| 199708 | 3주 전 | 90 | ||
| 199707 | 1개월 전 | 222 | ||
| 199706 | 1개월 전 | 26 | ||
| 199705 | 1개월 전 | 15 | ||
| 199704 | 1개월 전 | 32 | ||
| 199703 | 1개월 전 | 41 | ||
| 199702 | 1개월 전 | 79 | ||
| 199701 | 1개월 전 | 95 | ||
| 199700 | 1개월 전 | 68 | ||
| 199699 | 1개월 전 | 71 | ||
| 199698 | 1개월 전 | 116 | ||
| 199697 | 1개월 전 | 82 | ||
| 199696 |
 Gothrock |
1개월 전 | 229 | |
| 199695 | 1개월 전 | 70 | ||
| 199694 | 1개월 전 | 98 | ||
| 199693 | 1개월 전 | 166 | ||
| 199692 | 1개월 전 | 167 | ||
| 199691 |
 샬롬이아빠 |
1개월 전 | 139 | |
| 199690 | 1개월 전 | 234 | ||
| 199689 | 1개월 전 | 143 | ||
| 199688 | 1개월 전 | 172 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기