blob: 9cde0abcf941fbcf931ae19e2cafb598d5ab2052 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
|
---
title: Screen.lockOrientation()
slug: Web/API/Screen/lockOrientation
translation_of: Web/API/Screen/lockOrientation
---
<p>{{APIRef("CSSOM View")}}{{SeeCompatTable}}</p>
<p><code>lockOrientation</code> 此方法会把屏幕锁定为指定的方向.</p>
<div class="note">
<p><strong>注意:</strong> 此方法仅适用于已安装的Web apps 或 <a href="/en-US/docs/Web/Guide/DOM/Using_full_screen_mode">全屏模式</a> 的Web 页面.</p>
</div>
<h2 id="使用方法">使用方法</h2>
<pre class="syntaxbox"><em>lockedAllowed</em> = window.screen.lockOrientation(<em>orientation</em>);</pre>
<h3 id="参数介绍">参数介绍</h3>
<dl>
<dt><em>orientation</em></dt>
<dd>需要锁定屏幕的方向。这个参数是一个字符串或者是一个由字符串组成的数组。通过多个字符串可以让屏幕只在选定的方向上进行旋转。</dd>
</dl>
<p>以下的字符串即表示你也许会指定的一些可能的方向。</p>
<dl>
<dt><code>portrait-primary</code></dt>
<dd>它表示屏幕处于主要的肖像模式时的方向。如果设备处于正常位置且该位置处于纵向位置，或设备的正常位置处于横向并且设备保持顺时针转动90°，则会在主肖像模式下考虑屏幕。正常的位置是依赖于设备的。</dd>
<dt><code>portrait-secondary</code></dt>
<dd>
<p>它表示屏幕处于辅助肖像模式时的方向。如果设备与正常位置保持180°，并且该位置处于纵向位置，或者设备的正常位置处于横向位置，并且持有的设备逆时针转动90°，则屏幕将处于辅助人像模式。正常的位置是依赖于设备的。</p>
</dd>
<dt><code>landscape-primary</code></dt>
<dd>它代表了屏幕处于主要风景模式时的方向。 如果设备保持在正常位置，并且该位置处于横向位置，或者设备的正常位置处于纵向位置，并且所保持的设备顺时针旋转90°，则会将其视为主要横向模式。正常的位置是依赖于设备的。</dd>
<dt><code>landscape-secondary</code></dt>
<dd>它代表了屏幕处于次要风景模式时的方向。如果设备与其正常位置保持180°并且该位置处于横向，或者如果设备的正常位置是纵向的，并且所保持的设备逆时针旋转90°，则将其视为次要横向模式。正常的位置是依赖于设备的。</dd>
<dt><code>portrait</code></dt>
<dd>它表示同时包含 <code>portrait-primary</code> 和 <code>portrait-secondary</code>.</dd>
<dt><code>landscape</code></dt>
<dd>它表示同时包含 <code>landscape-primary</code> 和 <code>landscape-secondary</code>.</dd>
</dl>
<dl>
<dt><code>default</code></dt>
<dd>它代表 <code>portrait-primary</code> 和 <code>landscape-primary</code> 主要取决于设备的自然方向。例如，如果面板分辨率为1280 * 800，则 <code>default</code> 为横向，如果分辨率为800 * 1280，则 <code>default</code> 为纵向。</dd>
</dl>
<div class="note">
<p><strong>注意:</strong> 可同时设置多个锁定值。因此，如果锁定设置为只有一个方向，屏幕方向将永远不会改变，直到屏幕方向解锁。否则，只要方向在设备锁定的方向之中，屏幕方向就会从一个方向改变到另一个方向。</p>
</div>
<h2 id="返回值">返回值</h2>
<p>如果方向被授权锁定，则返回 <code>true</code> ;如果方向锁定被拒绝，则返回 <code>false</code>。请注意，返回值并不表示屏幕方向确实被锁定：可能会有延迟。</p>
<h2 id="示例">示例</h2>
<h3 id="使用_DOMString_参数">使用 <code>DOMString</code> 参数</h3>
<pre class="brush: js">screen.lockOrientationUniversal = screen.lockOrientation || screen.mozLockOrientation || screen.msLockOrientation;
if (screen.lockOrientationUniversal("landscape-primary")) {
// 方向已锁定成功
} else {
// 方向锁定失败
}
</pre>
<h3 id="使用_Array_参数">使用 <code>Array</code> 参数</h3>
<pre class="brush: js">screen.lockOrientationUniversal = screen.lockOrientation || screen.mozLockOrientation || screen.msLockOrientation;
if (screen.lockOrientationUniversal(["landscape-primary", "landscape-secondary"])) {
// 方向已锁定成功
} else {
// 方向锁定失败
}</pre>
<h2 id="规范">规范</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">规范</th>
<th scope="col">状态</th>
<th scope="col">说明</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('Screen Orientation', '', 'Screen Orientation')}}</td>
<td>{{Spec2('Screen Orientation')}}</td>
<td>Initial definition</td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容">浏览器兼容</h2>
{{Compat("api.Screen.lockOrientation")}}
<h2 id="参见">参见</h2>
<ul>
<li>{{domxref("Screen.orientation")}}</li>
<li>{{domxref("Screen.unlockOrientation()")}}</li>
<li>{{domxref("Screen.onorientationchange")}}</li>
<li><a href="/en-US/docs/Managing_screen_orientation">控制屏幕方向</a></li>
</ul>
|
