blob: dd419a7d6d4c89f548861d0018a95c63efaf1b56 (
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
|
---
title: Element.scrollIntoViewIfNeeded()
slug: Web/API/Element/scrollIntoViewIfNeeded
tags:
- API
- DOM
- 可视区域
- 方法
- 滚动
- 非标准
translation_of: Web/API/Element/scrollIntoViewIfNeeded
---
<div>{{APIRef("DOM")}}{{Non-standard_header}}</div>
<p><code><strong>Element.scrollIntoViewIfNeeded()</strong></code>方法用来将不在浏览器窗口的可见区域内的元素滚动到浏览器窗口的可见区域。 如果该元素已经在浏览器窗口的可见区域内,则不会发生滚动。 此方法是标准的<a href="/zh-CN/docs/Web/API/Element/scrollIntoView">Element.scrollIntoView()</a>方法的专有变体。</p>
<h2 id="语法">语法</h2>
<pre>element.scrollIntoViewIfNeeded(); // 等同于element.scrollIntoViewIfNeeded(true)
element.scrollIntoViewIfNeeded(true);
element.scrollIntoViewIfNeeded(false); </pre>
<h3 id="参数">参数</h3>
<dl>
<dt><em><code>opt_center</code></em></dt>
<dd>一个 {{jsxref("Boolean")}} 类型的值,默认为<code>true</code>:
<ul>
<li>如果为true,则元素将在其所在滚动区的可视区域中居中对齐。</li>
<li>如果为false,则元素将与其所在滚动区的可视区域最近的边缘对齐。 根据可见区域最靠近元素的哪个边缘,元素的顶部将与可见区域的顶部边缘对准,或者元素的底部边缘将与可见区域的底部边缘对准。</li>
</ul>
</dd>
</dl>
<h2 id="示例">示例</h2>
<pre>var element = document.getElementById("child");
element.scrollIntoViewIfNeeded();
element.scrollIntoViewIfNeeded(true);
element.scrollIntoViewIfNeeded(false);
</pre>
<h2 id="规范">规范</h2>
<p>不属于任何规范,是一种WebKit专有的方法。</p>
<h2 id="浏览器支持">浏览器支持</h2>
<p>{{Compat("api.Element.scrollIntoViewIfNeeded")}}</p>
<h2 id="相关链接">相关链接</h2>
<ul>
<li><a href="https://www.w3.org/Bugs/Public/show_bug.cgi?id=17152">W3C CSSOM bug 17152: Support centering an element when scrolling into view.</a> (一个等同于 scrollIntoViewIfNeeded 的标准功能特性)</li>
</ul>
|