blob: 960c33ca4fb66c03506e6dc9a073f57322aa1766 (
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
|
---
title: DOMRect
slug: Web/API/DOMRect
tags:
- API
- DOM
- DOM Reference
- DOMRect
- Geometry
- Geometry Interfaces
- Interface
- Rectangle
- Reference
browser-compat: api.DOMRect
---
<p>{{draft}}{{APIRef("Geometry Interfaces")}}</p>
<p><strong><code>DOMRect</code></strong>는 사각형의 크기와 위치를 나타냅니다.</p>
<p><code>DOMRect</code>가 표현하는 박스의 타입은 이를 반환한 메서드나 속성에 의해 정해집니다. 예를 들어, WebVR API의 {{domxref("VREyeParameters.renderRect")}}는 렌더링되어야 할 헤드 마운트 디스플레이의 한쪽 눈에 대한 비주얼을 <a href="/ko/docs/Web/API/HTMLCanvasElement">canvas</a>의 뷰포트로 지정합니다.</p>
<p>부모인 {{domxref("DOMRectReadOnly")}}로부터 상속받습니다.</p>
<p>{{InheritanceDiagram}}</p>
<h2 id="Constructor">생성자</h2>
<dl>
<dt>{{domxref("DOMRect.DOMRect","DOMRect()")}}</dt>
<dd>새로운 <code>DOMRect</code> 객체를 생성합니다.</dd>
</dl>
<h2 id="Properties">속성</h2>
<p><em><code>DOMRect</code>는 부모인 {{domxref("DOMRectReadOnly")}}로부터 상속받습니다. 차이점은 DomRect가 더 이상 읽기 전용이 아니라는 것입니다.</em></p>
<dl>
<dt>{{domxref("DOMRectReadOnly.x")}}</dt>
<dd><code>DOMRect</code>의 오리진(보통 사각형의 왼쪽 상단 코너) x 좌표.</dd>
<dt>{{domxref("DOMRectReadOnly.y")}}</dt>
<dd><code>DOMRect</code>의 오리진(보통 사각형의 왼쪽 상단 코너) y 좌표.</dd>
<dt>{{domxref("DOMRectReadOnly.width")}}</dt>
<dd><code>DOMRect</code>의 너비.</dd>
<dt>{{domxref("DOMRectReadOnly.height")}}</dt>
<dd><code>DOMRect</code>의 높이.</dd>
<dt>{{domxref("DOMRectReadOnly.top")}}</dt>
<dd><code>DOMRect</code>의 상단 좌표를 반환합니다(<code>height</code>가 음수라면 <code>y</code>, 또는 <code>y + height</code>와 같은 값을 갖습니다).</dd>
<dt>{{domxref("DOMRectReadOnly.right")}}</dt>
<dd><code>DOMRect</code>의 오른쪽 좌표를 반환합니다(<code>width</code>가 음수라면 <code>x + width</code>, 또는 <code>x</code>와 같은 값을 갖습니다).</dd>
<dt>{{domxref("DOMRectReadOnly.bottom")}}</dt>
<dd><code>DOMRect</code>의 하단 좌표를 반환합니다(<code>height</code>가 음수라면 <code>y + height</code>, 또는 <code>y</code>와 같은 값을 갖습니다).</dd>
<dt>{{domxref("DOMRectReadOnly.left")}}</dt>
<dd><code>DOMRect</code>의 왼쪽 좌표를 반환합니다(<code>width</code>가 음수라면 <code>x</code>, 또는 <code>x + width</code>와 같은 값을 갖습니다).</dd>
</dl>
<h2 id="Methods">메서드</h2>
<p><em><code>DOMRect</code>는 부모인 {{domxref("DOMRectReadOnly")}}로부터 메서드를 상속받습니다.</em></p>
<h2 id="Static_methods">정적 메서드</h2>
<dl>
<dt>{{domxref("DOMRectReadOnly.fromRect()")}}</dt>
<dd>주어진 위치와 면적을 갖는 새로운 <code>DOMRect</code> 객체를 생성합니다.</dd>
</dl>
<h2 id="Specifications">명세</h2>
{{Specifications}}
<h2 id="Browser_compatibility">브라우저 호환성</h2>
<p>{{Compat}}</p>
<h2 id="See_also">같이 보기</h2>
<ul>
<li>{{domxref("DOMPoint")}}</li>
</ul>
|
