OLD | NEW |
| (Empty) |
1 /* | |
2 Use a class to apply touch-action so that we can easily manually check | |
3 the tests for consistent behavior on IE10 as well. | |
4 */ | |
5 * /deep/ .ta-none { | |
6 -ms-touch-action: none; | |
7 touch-action: none; | |
8 } | |
9 .ta-auto { | |
10 -ms-touch-action: auto; | |
11 touch-action: auto; | |
12 } | |
13 .ta-panx { | |
14 -ms-touch-action: pan-x; | |
15 touch-action: pan-x; | |
16 } | |
17 .ta-pany { | |
18 -ms-touch-action: pan-y; | |
19 touch-action: pan-y; | |
20 } | |
21 .ta-panxy { | |
22 -ms-touch-action: pan-x pan-y; | |
23 touch-action: pan-x pan-y; | |
24 } | |
25 | |
26 .ta-manipulation { | |
27 -ms-touch-action: manipulation; | |
28 touch-action: manipulation; | |
29 } | |
30 | |
31 /* Make it easy to visualize div boundaries */ | |
32 [expected-action] { | |
33 margin: 15px; | |
34 padding: 10px; | |
35 border: 1px solid blue; | |
36 max-width: 700px; | |
37 } | |
38 | |
39 [expected-action=none]::before { | |
40 content: "NONE \2190 "; | |
41 } | |
42 [expected-action=auto]::before { | |
43 content: "AUTO \2190 "; | |
44 } | |
45 [expected-action=pan-x]::before { | |
46 content: "PAN-X \2190 "; | |
47 } | |
48 [expected-action=pan-y]::before { | |
49 content: "PAN-Y \2190 "; | |
50 } | |
51 [expected-action=pan-x-y]::before { | |
52 content: "PAN-X PAN-Y \2190 "; | |
53 } | |
54 [expected-action=manipulation]::before { | |
55 content: "MANIPULATION \2190 "; | |
56 } | |
57 | |
58 body { | |
59 /* Leave gap for test to scroll down */ | |
60 padding-top: 100px; | |
61 /* Ensure pages are scrollable for manual testing */ | |
62 height: 2000px; | |
63 /* Use fixed line height so co-ordinates will be similar in test and browser *
/ | |
64 font-size: 20px; | |
65 white-space: nowrap; | |
66 } | |
67 | |
68 .scroll { | |
69 overflow: scroll; | |
70 height: 50px; | |
71 } | |
72 .spacer { | |
73 height: 500px; | |
74 } | |
75 | |
76 .marker { | |
77 position: absolute; | |
78 opacity: 0.5; | |
79 /* Note, if changing size, be sure to change kMarkerSize in JS too */ | |
80 width: 6px; | |
81 height: 6px; | |
82 background-color: red; | |
83 } | |
OLD | NEW |