diff options
22 files changed, 742 insertions, 782 deletions
diff --git a/files/ko/web/api/batterymanager/index.html b/files/ko/web/api/batterymanager/index.html deleted file mode 100644 index 13ca755062..0000000000 --- a/files/ko/web/api/batterymanager/index.html +++ /dev/null @@ -1,74 +0,0 @@ ---- -title: BatteryManager -slug: Web/API/BatteryManager -translation_of: Web/API/BatteryManager ---- -<p>{{ApiRef()}}</p> - -<p><strong><code>BatteryManager</code></strong> 인터페이스는 시스템의 배터리 충전 상태에 대한 정보를 확인 하는 방법을 제공합니다.</p> - -<p>{{domxref("window.navigator.battery","navigator.battery")}} 프로퍼티는 Battery Status API와 상호작용 할 수 있는 <code>BatteryManager 인터페이스의 </code>인스턴스를 반환합니다.</p> - -<h2 id="프로퍼티">프로퍼티</h2> - -<dl> - <dt>{{domxref("BatteryManager.charging")}} {{ReadOnlyInline}}</dt> - <dd>배터리가 현재 충전 중인지 여부를 Boolean 값으로 나타냅니다.</dd> - <dt>{{domxref("BatteryManager.chargingTime")}} {{ReadOnlyInline}}</dt> - <dd>배터리가 완전히 충전되기 까지 남은 시간을 초로 표현합니다. 0 이면 이미 배터리의 충전이 완료 된 상황 입니다.</dd> - <dt>{{domxref("BatteryManager.dischargingTime")}} {{ReadOnlyInline}}</dt> - <dd>배터리가 완전히 방전되고 시스템이 중지 될 때까지의 남은 시간을 초로 표현 합니다.</dd> - <dt>{{domxref("BatteryManager.level")}} {{ReadOnlyInline}}</dt> - <dd>배터리의 충전 상태를 0.0 에서 1.0 사이의 값으로 표현 합니다.</dd> -</dl> - -<h3 id="이벤트_핸들러">이벤트 핸들러</h3> - -<dl> - <dt>{{domxref("BatteryManager.onchargingchange")}}</dt> - <dd>{{event("chargingchange")}} 이벤트의 핸들러 입니다. 이 이벤트는 배터리 충전 상태가 변경될 때 발생합니다.</dd> - <dt>{{domxref("BatteryManager.onchargingtimechange")}}</dt> - <dd>{{event("chargingtimechange")}} 이벤트의 핸들러 입니다. 이 이벤트는 배터리 충전 시간이 변경될 때 발생합니다.</dd> - <dt>{{domxref("BatteryManager.ondischargingtimechange")}}</dt> - <dd>{{event("dischargingtimechange")}} 이벤트의 핸들러 입니다. 이 이벤트는 배터리 방전 시간이 변경될 때 발생합니다.</dd> - <dt>{{domxref("BatteryManager.onlevelchange")}}</dt> - <dd>{{event("levelchange")}} 이벤트의 핸들러 입니다. 이 이벤트는 배터리 수준 상태가 변경 될 때 발생합니다.</dd> -</dl> - -<h2 id="메소드">메소드</h2> - -<p>Inherited from {{domxref("EventTarget")}}:</p> - -<p>{{domxref("EventTarget")}} 으로 부터 상속을 받습니다:</p> - -<p>{{page("/en-US/docs/Web/API/EventTarget","Methods")}}</p> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('Battery API')}}</td> - <td>{{Spec2('Battery API')}}</td> - <td>초기 명세</td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<p>{{Compat("api.BatteryManager")}}</p> - -<h2 id="참고">참고</h2> - -<ul> - <li>{{ domxref("window.navigator.battery","navigator.battery") }}</li> - <li><a href="/ko/docs/WebAPI/Battery_Status" title="/en-US/docs/WebAPI/Battery_Status">Battery Status API</a></li> -</ul> diff --git a/files/ko/web/api/batterymanager/index.md b/files/ko/web/api/batterymanager/index.md new file mode 100644 index 0000000000..a8d5be49fe --- /dev/null +++ b/files/ko/web/api/batterymanager/index.md @@ -0,0 +1,57 @@ +--- +title: BatteryManager +slug: Web/API/BatteryManager +tags: + - API + - Battery API + - Device API + - Interface + - Deprecated + - Reference +browser-compat: api.BatteryManager +translation_of: Web/API/BatteryManager +--- +{{APIRef}}{{deprecated_header}} + +**`BatteryManager`** 인터페이스는 시스템의 배터리 충전 상태에 대한 정보를 확인 하는 방법을 제공합니다. + +{{domxref("window.navigator.battery","navigator.battery")}} 프로퍼티는 Battery Status API와 상호작용 할 수 있는 `BatteryManager 인터페이스의 `인스턴스를 반환합니다. + +## 속성 + +- {{domxref("BatteryManager.charging")}} {{ReadOnlyInline}} + - : 배터리가 현재 충전 중인지 여부를 Boolean 값으로 나타냅니다. +- {{domxref("BatteryManager.chargingTime")}} {{ReadOnlyInline}} + - : 배터리가 완전히 충전되기 까지 남은 시간을 초로 표현합니다. 0 이면 이미 배터리의 충전이 완료 된 상황 입니다. +- {{domxref("BatteryManager.dischargingTime")}} {{ReadOnlyInline}} + - : 배터리가 완전히 방전되고 시스템이 중지 될 때까지의 남은 시간을 초로 표현 합니다. +- {{domxref("BatteryManager.level")}} {{ReadOnlyInline}} + - : 배터리의 충전 상태를 0.0 에서 1.0 사이의 값으로 표현 합니다. + +### 이벤트 처리기 + +- {{domxref("BatteryManager.onchargingchange")}} + - : {{event("chargingchange")}} 이벤트의 핸들러 입니다. 이 이벤트는 배터리 충전 상태가 변경될 때 발생합니다. +- {{domxref("BatteryManager.onchargingtimechange")}} + - : {{event("chargingtimechange")}} 이벤트의 핸들러 입니다. 이 이벤트는 배터리 충전 시간이 변경될 때 발생합니다. +- {{domxref("BatteryManager.ondischargingtimechange")}} + - : {{event("dischargingtimechange")}} 이벤트의 핸들러 입니다. 이 이벤트는 배터리 방전 시간이 변경될 때 발생합니다. +- {{domxref("BatteryManager.onlevelchange")}} + - : {{event("levelchange")}} 이벤트의 핸들러 입니다. 이 이벤트는 배터리 수준 상태가 변경 될 때 발생합니다. + +## 메서드 + +{{domxref("EventTarget")}} 으로 부터 상속을 받습니다. + +## 명세 + +{{Specifications}} + +## 브라우저 호환성 + +{{Compat}} + +## 참고 + +- {{ domxref("window.navigator.battery","navigator.battery") }} +- [Battery Status API](/ko/docs/WebAPI/Battery_Status "/en-US/docs/WebAPI/Battery_Status") diff --git a/files/ko/web/api/biquadfilternode/index.html b/files/ko/web/api/biquadfilternode/index.html deleted file mode 100644 index 4cf2d80e7c..0000000000 --- a/files/ko/web/api/biquadfilternode/index.html +++ /dev/null @@ -1,171 +0,0 @@ ---- -title: BiquadFilterNode -slug: Web/API/BiquadFilterNode -translation_of: Web/API/BiquadFilterNode ---- -<p>{{APIRef("Web Audio API")}}</p> - -<div> -<p><span class="seoSummary">The <code>BiquadFilterNode</code> interface represents a simple low-order filter, and is created using the {{ domxref("AudioContext.createBiquadFilter()") }} method. It is an {{domxref("AudioNode")}} that can represent different kinds of filters, tone control devices, and graphic equalizers.</span> A <code>BiquadFilterNode</code> always has exactly one input and one output.</p> -</div> - -<table class="properties"> - <tbody> - <tr> - <th scope="row">Number of inputs</th> - <td><code>1</code></td> - </tr> - <tr> - <th scope="row">Number of outputs</th> - <td><code>1</code></td> - </tr> - <tr> - <th scope="row">Channel count mode</th> - <td><code>"max"</code></td> - </tr> - <tr> - <th scope="row">Channel count</th> - <td><code>2</code> (not used in the default count mode)</td> - </tr> - <tr> - <th scope="row">Channel interpretation</th> - <td><code>"speakers"</code></td> - </tr> - </tbody> -</table> - -<h2 id="Constructor">Constructor</h2> - -<dl> - <dt>{{domxref("BiquadFilterNode.BiquadFilterNode", "BiquadFilterNode()")}}</dt> - <dd>Creates a new instance of an <code>BiquadFilterNode</code> object.</dd> -</dl> - -<h2 id="Properties">Properties</h2> - -<p><em>Inherits properties from its parent, </em><em>{{domxref("AudioNode")}}</em>.</p> - -<dl> - <dt>{{domxref("BiquadFilterNode.frequency")}}</dt> - <dd>Is an <a href="/en-US/docs/Web/API/AudioParam#a-rate">a-rate</a> {{domxref("AudioParam")}}, a double representing a frequency in the current filtering algorithm measured in hertz (Hz).</dd> - <dt>{{domxref("BiquadFilterNode.detune")}}</dt> - <dd>Is an <a href="/en-US/docs/Web/API/AudioParam#a-rate">a-rate</a> {{domxref("AudioParam")}} representing detuning of the frequency in <a class="external external-icon" href="http://en.wikipedia.org/wiki/Cent_%28music%29">cents</a>.</dd> - <dt>{{domxref("BiquadFilterNode.Q")}}</dt> - <dd>Is an <a href="/en-US/docs/Web/API/AudioParam#a-rate">a-rate</a> {{domxref("AudioParam")}}, a double representing a <a href="http://en.wikipedia.org/wiki/Q_factor">Q factor</a>, or <em>quality factor</em>.</dd> - <dt>{{domxref("BiquadFilterNode.gain")}} {{readonlyInline}}</dt> - <dd>Is an <a href="/en-US/docs/Web/API/AudioParam#a-rate">a-rate</a> {{domxref("AudioParam")}}, a double representing the <a href="http://en.wikipedia.org/wiki/Gain">gain</a> used in the current filtering algorithm.</dd> - <dt>{{domxref("BiquadFilterNode.type")}}</dt> - <dd>Is a string value defining the kind of filtering algorithm the node is implementing.<br> - - <table class="standard-table"> - <caption>The meaning of the different parameters depending of the type of the filter (detune has the same meaning regardless, so isn't listed below)</caption> - <thead> - <tr> - <th scope="row"><code>type</code></th> - <th scope="col">Description</th> - <th scope="col"><code>frequency</code></th> - <th scope="col"><code>Q</code></th> - <th scope="col"><code>gain</code></th> - </tr> - </thead> - <tbody> - <tr> - <th scope="row"><code>lowpass</code></th> - <td>12dB/octave의 롤오프를 가진 표준 2차 공진 로우패스 필터입니다. 컷오프 이하의 주파수는 통과하며 그 이상의 주파수는 감쇠합니다.</td> - <td>컷오프 주파수</td> - <td>컷오프 부근에서 주파수의 피크가 얼마나 큰지 나타냅니다. 값이 클수록 피크가 커집니다.</td> - <td><em>Not used</em></td> - </tr> - <tr> - <th scope="row"><code>highpass</code></th> - <td>12dB/octave의 롤오프를 가진 표준 2차 공진 하이패스 필터입니다. 컷오프 이하의 주파수는 감쇠하며 그 이상의 주파수는 통과합니다.</td> - <td>컷오프 주파수</td> - <td>컷오프 부근에서 주파수의 피크가 얼마나 큰지 나타냅니다. 값이 클수록 피크가 커집니다.</td> - <td><em>Not used</em></td> - </tr> - <tr> - <th scope="row"><code>bandpass</code></th> - <td>표준 2차 밴드패스 필터입니다. 주어진 주파수 대역 바깥의 주파수는 감쇠되며, 이내의 주파수는 통과합니다.</td> - <td>주파수 대역의 중앙</td> - <td>주파수 대역의 폭을 조정합니다. Q값이 클수록 주파수 대역은 작아집니다.</td> - <td><em>Not used</em></td> - </tr> - <tr> - <th scope="row"><code>lowshelf</code></th> - <td>표준 2차 로우쉘프 필터입니다. 기준 주파수보다 낮은 주파수는 증폭되거나 감쇠됩니다. 그 이상의 주파수는 변하지 않습니다.</td> - <td>증폭이나 감쇠를 얻는 주파수의 상한값</td> - <td><em>Not used</em></td> - <td>적용할 증폭(단위 : dB), 음수이면 감쇠됩니다.</td> - </tr> - <tr> - <th scope="row"><code>highshelf</code></th> - <td>표준 2차 하이쉘프 필터입니다. 기준 주파수보다 큰 주파수는 증폭되거나 감쇠됩니다. 그 이하의 주파수는 변하지 않습니다.</td> - <td>증폭이나 감쇠를 얻는 주파수의 하한값</td> - <td><em>Not used</em></td> - <td>적용할 증폭(단위 : dB), 음수이면 감쇠됩니다.</td> - </tr> - <tr> - <th scope="row"><code>peaking</code></th> - <td>대역 내의 주파수는 증폭되거나 감쇠됩니다. 바깥의 주파수는 변하지 않습니다.</td> - <td>증폭이나 감쇠를 얻는 주파수 대역의 중앙</td> - <td>주파수 대역의 폭을 조정합니다. Q값이 클수록 주파수 대역은 작아집니다.</td> - <td>적용할 증폭(단위 : dB), 음수이면 감쇠됩니다.</td> - </tr> - <tr> - <th scope="row"><code>notch</code></th> - <td>밴드 스톱, 혹은 밴드 리젝션으로 불리는 표준 <a href="http://en.wikipedia.org/wiki/Band-stop_filter" title="/en-US/docs/">notch</a> 필터입니다. 이는 밴드패스 필터와 반대입니다. 주어진 대역폭 바깥의 주파수는 통과하며, 안쪽의 주파수는 감쇠합니다.</td> - <td>주파수 대역의 중앙</td> - <td>주파수 대역의 폭을 조정합니다. Q값이 클수록 주파수 대역은 작아집니다.</td> - <td><em>Not used</em></td> - </tr> - <tr> - <th scope="row"><code>allpass</code></th> - <td>표준 2차 <a href="http://en.wikipedia.org/wiki/All-pass_filter#Digital_Implementation" title="/en-US/docs/">allpass</a> 필터입니다. 이는 모든 주파수를 통과시키지만, 가변 주파수 사이의 위상 관계를 변화시킵니다.</td> - <td>최대 <a href="http://en.wikipedia.org/wiki/Group_delay_and_phase_delay" title="/en-US/docs/">group delay</a>를 갖는 주파수, 즉 위상 전이 발생의 중심에 있는 주파수입니다.</td> - <td>중간 주파수에서 전환이 얼마나 선명한가를 제어합니다. 이 매개 변수가 클수록 더 선명하고 크게 전환됩니다.</td> - <td><em>Not used</em></td> - </tr> - </tbody> - </table> - </dd> -</dl> - -<h2 id="Methods">Methods</h2> - -<p><em>{{domxref("AudioNode")}} 로부터 메서드를 상속받습니다</em>.</p> - -<dl> - <dt>{{domxref("BiquadFilterNode.getFrequencyResponse()")}}</dt> - <dd>이 메서드는 현재 필터 파라미터 설정으로부터 제공된 주파수 배열에 지정된 주파수에 대한 주파수 응답을 계산합니다</dd> -</dl> - -<h2 id="Example">Example</h2> - -<p>{{page("/en-US/docs/Web/API/AudioContext.createBiquadFilter","Example")}}</p> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('Web Audio API', '#the-biquadfilternode-interface', 'BiquadFilterNode')}}</td> - <td>{{Spec2('Web Audio API')}}</td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<p>{{Compat("api.BiquadFilterNode")}}</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="/en-US/docs/Web_Audio_API/Using_Web_Audio_API">Using the Web Audio API</a></li> -</ul> diff --git a/files/ko/web/api/biquadfilternode/index.md b/files/ko/web/api/biquadfilternode/index.md new file mode 100644 index 0000000000..fefa6f60d1 --- /dev/null +++ b/files/ko/web/api/biquadfilternode/index.md @@ -0,0 +1,210 @@ +--- +title: BiquadFilterNode +slug: Web/API/BiquadFilterNode +tags: + - API + - BiquadFilterNode + - Interface + - Reference + - Web Audio API +translation_of: Web/API/BiquadFilterNode +--- +{{APIRef("Web Audio API")}} + +The `BiquadFilterNode` interface represents a simple low-order filter, and is created using the {{ domxref("AudioContext.createBiquadFilter()") }} method. It is an {{domxref("AudioNode")}} that can represent different kinds of filters, tone control devices, and graphic equalizers. A `BiquadFilterNode` always has exactly one input and one output. + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Number of inputs</th> + <td><code>1</code></td> + </tr> + <tr> + <th scope="row">Number of outputs</th> + <td><code>1</code></td> + </tr> + <tr> + <th scope="row">Channel count mode</th> + <td><code>"max"</code></td> + </tr> + <tr> + <th scope="row">Channel count</th> + <td><code>2</code> (not used in the default count mode)</td> + </tr> + <tr> + <th scope="row">Channel interpretation</th> + <td><code>"speakers"</code></td> + </tr> + </tbody> +</table> + +## Constructor + +- {{domxref("BiquadFilterNode.BiquadFilterNode", "BiquadFilterNode()")}} + - : Creates a new instance of an `BiquadFilterNode` object. + +## Properties + +_Inherits properties from its parent,_ _{{domxref("AudioNode")}}_. + +- {{domxref("BiquadFilterNode.frequency")}} + - : Is an [a-rate](/en-US/docs/Web/API/AudioParam#a-rate) {{domxref("AudioParam")}}, a double representing a frequency in the current filtering algorithm measured in hertz (Hz). +- {{domxref("BiquadFilterNode.detune")}} + - : Is an [a-rate](/en-US/docs/Web/API/AudioParam#a-rate) {{domxref("AudioParam")}} representing detuning of the frequency in [cents](http://en.wikipedia.org/wiki/Cent_%28music%29). +- {{domxref("BiquadFilterNode.Q")}} + - : Is an [a-rate](/en-US/docs/Web/API/AudioParam#a-rate) {{domxref("AudioParam")}}, a double representing a [Q factor](http://en.wikipedia.org/wiki/Q_factor), or _quality factor_. +- {{domxref("BiquadFilterNode.gain")}} {{readonlyInline}} + - : Is an [a-rate](/en-US/docs/Web/API/AudioParam#a-rate) {{domxref("AudioParam")}}, a double representing the [gain](http://en.wikipedia.org/wiki/Gain) used in the current filtering algorithm. +- {{domxref("BiquadFilterNode.type")}} + + - : Is a string value defining the kind of filtering algorithm the node is implementing. + + <table class="standard-table"> + <caption> + The meaning of the different parameters depending of the type of the filter + (detune has the same meaning regardless, so isn't listed below) + </caption> + <thead> + <tr> + <th scope="row"><code>type</code></th> + <th scope="col">Description</th> + <th scope="col"><code>frequency</code></th> + <th scope="col"><code>Q</code></th> + <th scope="col"><code>gain</code></th> + </tr> + </thead> + <tbody> + <tr> + <th scope="row"><code>lowpass</code></th> + <td> + 12dB/octave의 롤오프를 가진 표준 2차 공진 로우패스 필터입니다. 컷오프 + 이하의 주파수는 통과하며 그 이상의 주파수는 감쇠합니다. + </td> + <td>컷오프 주파수</td> + <td> + 컷오프 부근에서 주파수의 피크가 얼마나 큰지 나타냅니다. 값이 클수록 + 피크가 커집니다. + </td> + <td><em>Not used</em></td> + </tr> + <tr> + <th scope="row"><code>highpass</code></th> + <td> + 12dB/octave의 롤오프를 가진 표준 2차 공진 하이패스 필터입니다. 컷오프 + 이하의 주파수는 감쇠하며 그 이상의 주파수는 통과합니다. + </td> + <td>컷오프 주파수</td> + <td> + 컷오프 부근에서 주파수의 피크가 얼마나 큰지 나타냅니다. 값이 클수록 + 피크가 커집니다. + </td> + <td><em>Not used</em></td> + </tr> + <tr> + <th scope="row"><code>bandpass</code></th> + <td> + 표준 2차 밴드패스 필터입니다. 주어진 주파수 대역 바깥의 주파수는 + 감쇠되며, 이내의 주파수는 통과합니다. + </td> + <td>주파수 대역의 중앙</td> + <td> + 주파수 대역의 폭을 조정합니다. Q값이 클수록 주파수 대역은 작아집니다. + </td> + <td><em>Not used</em></td> + </tr> + <tr> + <th scope="row"><code>lowshelf</code></th> + <td> + 표준 2차 로우쉘프 필터입니다. 기준 주파수보다 낮은 주파수는 증폭되거나 + 감쇠됩니다. 그 이상의 주파수는 변하지 않습니다. + </td> + <td>증폭이나 감쇠를 얻는 주파수의 상한값</td> + <td><em>Not used</em></td> + <td>적용할 증폭(단위 : dB), 음수이면 감쇠됩니다.</td> + </tr> + <tr> + <th scope="row"><code>highshelf</code></th> + <td> + 표준 2차 하이쉘프 필터입니다. 기준 주파수보다 큰 주파수는 증폭되거나 + 감쇠됩니다. 그 이하의 주파수는 변하지 않습니다. + </td> + <td>증폭이나 감쇠를 얻는 주파수의 하한값</td> + <td><em>Not used</em></td> + <td>적용할 증폭(단위 : dB), 음수이면 감쇠됩니다.</td> + </tr> + <tr> + <th scope="row"><code>peaking</code></th> + <td> + 대역 내의 주파수는 증폭되거나 감쇠됩니다. 바깥의 주파수는 변하지 + 않습니다. + </td> + <td>증폭이나 감쇠를 얻는 주파수 대역의 중앙</td> + <td> + 주파수 대역의 폭을 조정합니다. Q값이 클수록 주파수 대역은 작아집니다. + </td> + <td>적용할 증폭(단위 : dB), 음수이면 감쇠됩니다.</td> + </tr> + <tr> + <th scope="row"><code>notch</code></th> + <td> + 밴드 스톱, 혹은 밴드 리젝션으로 불리는 표준 <a + href="http://en.wikipedia.org/wiki/Band-stop_filter" + title="/en-US/docs/" + >notch</a + > 필터입니다. 이는 밴드패스 필터와 반대입니다. 주어진 대역폭 바깥의 + 주파수는 통과하며, 안쪽의 주파수는 감쇠합니다. + </td> + <td>주파수 대역의 중앙</td> + <td> + 주파수 대역의 폭을 조정합니다. Q값이 클수록 주파수 대역은 작아집니다. + </td> + <td><em>Not used</em></td> + </tr> + <tr> + <th scope="row"><code>allpass</code></th> + <td> + 표준 2차 <a + href="http://en.wikipedia.org/wiki/All-pass_filter#Digital_Implementation" + title="/en-US/docs/" + >allpass</a + > 필터입니다. 이는 모든 주파수를 통과시키지만, 가변 주파수 사이의 위상 + 관계를 변화시킵니다. + </td> + <td> + 최대 <a + href="http://en.wikipedia.org/wiki/Group_delay_and_phase_delay" + title="/en-US/docs/" + >group delay</a + >를 갖는 주파수, 즉 위상 전이 발생의 중심에 있는 주파수입니다. + </td> + <td> + 중간 주파수에서 전환이 얼마나 선명한가를 제어합니다. 이 매개 변수가 + 클수록 더 선명하고 크게 전환됩니다. + </td> + <td><em>Not used</em></td> + </tr> + </tbody> + </table> + +## Methods + +_{{domxref("AudioNode")}} 로부터 메서드를 상속받습니다_. + +- {{domxref("BiquadFilterNode.getFrequencyResponse()")}} + - : 이 메서드는 현재 필터 파라미터 설정으로부터 제공된 주파수 배열에 지정된 주파수에 대한 주파수 응답을 계산합니다 + +## Example + +See [`AudioContext.createBiquadFilter`](/en-US/docs/Web/API/BaseAudioContext/createBiquadFilter#example) for example code that shows how to use an `AudioContext` to create a Biquad filter node. + +## Specifications + +{{Specifications}} + +## Browser compatibility + +{{Compat}} + +## See also + +- [Using the Web Audio API](/en-US/docs/Web_Audio_API/Using_Web_Audio_API) diff --git a/files/ko/web/api/datatransfer/getdata/index.html b/files/ko/web/api/datatransfer/getdata/index.html deleted file mode 100644 index 8a9edcf029..0000000000 --- a/files/ko/web/api/datatransfer/getdata/index.html +++ /dev/null @@ -1,112 +0,0 @@ ---- -title: DataTransfer.getData() -slug: Web/API/DataTransfer/getData -tags: - - API - - HTML DOM - - Method - - Reference -translation_of: Web/API/DataTransfer/getData ---- -<div> -<p>{{APIRef("HTML DOM")}}</p> -</div> - -<p><strong><code>DataTransfer.getData()</code></strong> 메소드는 특정 형태를 위해 ({{domxref("DOMString")}}로) 끌어낸 데이터를 회수한다. 가령, 끌어내는 동작이 데이터를 포함하지 않는다면, 이 메소드는 빈 문자열을 반환한다.</p> - -<p>예시 데이터 형식으로는 <code>text/plain</code> 와 <code>text/uri-list </code>이 있다.</p> - -<h2 id="구문">구문</h2> - -<pre class="syntaxbox"><var>dataTransfer</var>.getData(<em>format</em>); -</pre> - -<h3 id="매개변수">매개변수</h3> - -<dl> - <dt><code><em>format</em></code></dt> - <dd>회수할 데이터 형식을 나타내는 {{domxref("DOMString")}}</dd> -</dl> - -<h3 id="반환_값">반환 값</h3> - -<dl> - <dt>{{domxref("DOMString")}}</dt> - <dd>특정 <code>format</code>을 위해 끌어낸 데이터를 나타내는 {{domxref("DOMString")}}. 만약 끌어내는 동작이 데이터를 가지고 있지 않거나 동작이 특정 <code>format</code> 에 대한 데이터를 가지고 있지 않다면, 이 메소드는 빈 문자열을 반환한다.</dd> -</dl> - -<h2 id="예제">예제</h2> - -<p>이 예시는 {{domxref("DataTransfer")}} 객체의 {{domxref("DataTransfer.getData()","getData()")}} 와 {{domxref("DataTransfer.setData()","setData()")}} 메소드의 사용을 보여준다.</p> - -<h3 id="HTML_내용">HTML 내용</h3> - -<pre class="brush: html"><div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"> - <span id="drag" draggable="true" ondragstart="drag(event)">drag me to the other box</span> -</div> -<div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div> -</pre> - -<h3 id="CSS_내용">CSS 내용</h3> - -<pre class="brush: css">#div1, #div2 { - width:100px; - height:50px; - padding:10px; - border:1px solid #aaaaaa; -} -</pre> - -<h3 id="JavaScript_내용">JavaScript 내용</h3> - -<pre class="brush: js">function allowDrop(allowdropevent) { - allowdropevent.target.style.color = 'blue'; - allowdropevent.preventDefault(); -} - -function drag(dragevent) { - dragevent.dataTransfer.setData("text", dragevent.target.id); - dragevent.target.style.color = 'green'; -} - -function drop(dropevent) { - dropevent.preventDefault(); - var data = dropevent.dataTransfer.getData("text"); - dropevent.target.appendChild(document.getElementById(data)); - document.getElementById("drag").style.color = 'black'; -} -</pre> - -<h3 id="결과">결과</h3> - -<p id="EmbedLiveSample('Example'_''_''_''_'WebAPIDataTransfergetData')">{{ EmbedLiveSample('예제', 600) }}</p> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">명세</th> - <th scope="col">상태</th> - <th scope="col">비고</th> - </tr> - <tr> - <td>{{SpecName("HTML WHATWG", "interaction.html#dom-datatransfer-getdata", "getData()")}}</td> - <td>{{Spec2("HTML WHATWG")}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName("HTML5.1", "editing.html#dom-datatransfer-getdata", "getData()")}}</td> - <td>{{Spec2("HTML5.1")}}</td> - <td>첫 정의</td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<p>{{Compat("api.DataTransfer.getData")}}</p> - -<h2 id="같이_보기">같이 보기</h2> - -<p>{{page("/en-US/docs/Web/API/DataTransfer", "See also")}}</p> diff --git a/files/ko/web/api/datatransfer/getdata/index.md b/files/ko/web/api/datatransfer/getdata/index.md new file mode 100644 index 0000000000..a79742ee79 --- /dev/null +++ b/files/ko/web/api/datatransfer/getdata/index.md @@ -0,0 +1,96 @@ +--- +title: DataTransfer.getData() +slug: Web/API/DataTransfer/getData +tags: + - API + - HTML DOM + - Method + - Reference +translation_of: Web/API/DataTransfer/getData +--- +{{APIRef("HTML DOM")}} + +**`DataTransfer.getData()`** 메소드는 특정 형태를 위해 ({{domxref("DOMString")}}로) 끌어낸 데이터를 회수한다. 가령, 끌어내는 동작이 데이터를 포함하지 않는다면, 이 메소드는 빈 문자열을 반환한다. + +예시 데이터 형식으로는 `text/plain` 와 `text/uri-list `이 있다. + +## 구문 + +```js +dataTransfer.getData(format); +``` + +### 매개변수 + +- `format` + - : 회수할 데이터 형식을 나타내는 {{domxref("DOMString")}} + +### 반환 값 + +- {{domxref("DOMString")}} + - : 특정 `format`을 위해 끌어낸 데이터를 나타내는 {{domxref("DOMString")}}. 만약 끌어내는 동작이 데이터를 가지고 있지 않거나 동작이 특정 `format` 에 대한 데이터를 가지고 있지 않다면, 이 메소드는 빈 문자열을 반환한다. + +## 예제 + +이 예시는 {{domxref("DataTransfer")}} 객체의 {{domxref("DataTransfer.getData()","getData()")}} 와 {{domxref("DataTransfer.setData()","setData()")}} 메소드의 사용을 보여준다. + +### HTML 내용 + +```html +<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"> + <span id="drag" draggable="true" ondragstart="drag(event)">drag me to the other box</span> +</div> +<div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div> +``` + +### CSS 내용 + +```css +#div1, #div2 { + width:100px; + height:50px; + padding:10px; + border:1px solid #aaaaaa; +} +``` + +### JavaScript 내용 + +```js +function allowDrop(allowdropevent) { + allowdropevent.target.style.color = 'blue'; + allowdropevent.preventDefault(); +} + +function drag(dragevent) { + dragevent.dataTransfer.setData("text", dragevent.target.id); + dragevent.target.style.color = 'green'; +} + +function drop(dropevent) { + dropevent.preventDefault(); + var data = dropevent.dataTransfer.getData("text"); + dropevent.target.appendChild(document.getElementById(data)); + document.getElementById("drag").style.color = 'black'; +} +``` + +### 결과 + +{{EmbedLiveSample('예제', 600) }} + +## 명세 + +{{Specifications}} + +## 브라우저 호환성 + +{{Compat}} + +## 같이 보기 + +- [Drag and drop](/ko/docs/Web/API/HTML_Drag_and_Drop_API) +- [Drag Operations](/ko/docs/Web/API/HTML_Drag_and_Drop_API/Drag_operations) +- [Recommended Drag Types](/ko/docs/Web/API/HTML_Drag_and_Drop_API/Recommended_drag_types) +- [Dragging and Dropping Multiple Items](/ko/docs/Web/API/HTML_Drag_and_Drop_API/Multiple_items) +- [DataTransfer test - Paste or Drag](https://codepen.io/tech_query/pen/MqGgap) diff --git a/files/ko/web/api/document/index.html b/files/ko/web/api/document/index.html index 45b84641fa..fcadd51e09 100644 --- a/files/ko/web/api/document/index.html +++ b/files/ko/web/api/document/index.html @@ -87,10 +87,6 @@ translation_of: Web/API/Document <dd>문서의 표시 상태를 나타내는 문자열을 반환합니다. 가능한 값은 <code>visible</code>, <code>hidden</code>, <code>prerender</code>, <code>unloaded</code>입니다.</dd> </dl> -<p><code>Document</code> 인터페이스는 {{domxref("ParentNode")}} 인터페이스를 확장합니다.</p> - -<p>{{page("/ko/docs/Web/API/ParentNode","속성")}}</p> - <h3 id="HTMLDocument_확장">HTMLDocument 확장</h3> <p>HTML 문서를 위한 <code>Document</code> 인터페이스는 HTML5 이전엔 {{domxref("HTMLDocument")}} 인터페이스를 상속하고, 이후로는 확장합니다.</p> @@ -160,10 +156,6 @@ translation_of: Web/API/Document <dd>{{event("visibilitychange")}} 이벤트가 발생할 때 호출되는 코드를 나타내는 {{event("Event_handlers", "event handler")}} 입니다.</dd> </dl> -<p><code>Document</code> 인터페이스는 {{domxref("GlobalEventHandlers")}} 인터페이스를 확장합니다.</p> - -<p>{{Page("/ko/docs/Web/API/GlobalEventHandlers", "속성")}}</p> - <h3 id="사용하지_않는_속성">사용하지 않는 속성</h3> <dl> diff --git a/files/ko/web/api/dragevent/index.html b/files/ko/web/api/dragevent/index.html deleted file mode 100644 index 855e0fa9eb..0000000000 --- a/files/ko/web/api/dragevent/index.html +++ /dev/null @@ -1,109 +0,0 @@ ---- -title: DragEvent -slug: Web/API/DragEvent -tags: - - API - - DragEvent - - Reference - - drag and drop -translation_of: Web/API/DragEvent ---- -<div>{{APIRef("HTML Drag and Drop API")}}</div> - -<p>The <strong><code>DragEvent</code></strong> interface is a {{domxref("Event","DOM event")}} that represents a drag and drop interaction. The user initiates a drag by placing a pointer device (such as a mouse) on the touch surface and then dragging the pointer to a new location (such as another DOM element). Applications are free to interpret a drag and drop interaction in an application-specific way.</p> - -<p class="note">This interface inherits properties from {{domxref("MouseEvent")}} and {{domxref("Event")}}.</p> - -<h2 id="Properties">Properties</h2> - -<dl> - <dt>{{domxref('DragEvent.dataTransfer')}} {{readonlyInline}}</dt> - <dd>The data that is transferred during a drag and drop interaction.</dd> -</dl> - -<h2 id="Constructors">Constructors</h2> - -<p class="note">Although this interface has a constructor, it is not possible to create a useful DataTransfer object from script, since {{domxref("DataTransfer")}} objects have a processing and security model that is coordinated by the browser during drag-and-drops.</p> - -<dl> - <dt>{{domxref("DragEvent.DragEvent", "DragEvent()")}}</dt> - <dd>Creates a synthetic and untrusted DragEvent.</dd> -</dl> - -<h2 id="Event_types">Event types</h2> - -<dl> - <dt>{{event('drag')}}</dt> - <dd>This event is fired when an element or text selection is being dragged.</dd> - <dt>{{event('dragend')}}</dt> - <dd>This event is fired when a drag operation is being ended (by releasing a mouse button or hitting the escape key).</dd> - <dt>{{event('dragenter')}}</dt> - <dd>This event is fired when a dragged element or text selection enters a valid drop target.</dd> - <dt>{{event('dragexit')}}</dt> - <dd>This event is fired when an element is no longer the drag operation's immediate selection target.</dd> - <dt>{{event('dragleave')}}</dt> - <dd>This event is fired when a dragged element or text selection leaves a valid drop target.</dd> - <dt>{{event('dragover')}}</dt> - <dd>This event is fired continuously when an element or text selection is being dragged and the mouse pointer is over a valid drop target (every 50 ms WHEN mouse is not moving ELSE much faster between 5 ms (slow movement) and 1ms (fast movement) approximately. This firing pattern is different than {{Event("mouseover")}} ).</dd> - <dt>{{event('dragstart')}}</dt> - <dd>This event is fired when the user starts dragging an element or text selection.</dd> - <dt>{{event('drop')}}</dt> - <dd>This event is fired when an element or text selection is dropped on a valid drop target.</dd> -</dl> - -<h2 id="GlobalEventHandlers">GlobalEventHandlers</h2> - -<dl> - <dt>{{domxref('GlobalEventHandlers.ondrag')}}</dt> - <dd>A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('drag')}} event.</dd> - <dt>{{domxref('GlobalEventHandlers.ondragend')}}</dt> - <dd>A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('dragend')}} event.</dd> - <dt>{{domxref('GlobalEventHandlers.ondragenter')}}</dt> - <dd>A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('dragenter')}} event.</dd> - <dt>{{domxref('GlobalEventHandlers.ondragexit')}}</dt> - <dd>A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('dragexit')}} event.</dd> - <dt>{{domxref('GlobalEventHandlers.ondragleave')}}</dt> - <dd>A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('dragleave')}} event.</dd> - <dt>{{domxref('GlobalEventHandlers.ondragover')}}</dt> - <dd>A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('dragover')}} event.</dd> - <dt>{{domxref('GlobalEventHandlers.ondragstart')}}</dt> - <dd>A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('dragstart')}} event.</dd> - <dt>{{domxref('GlobalEventHandlers.ondrop')}}</dt> - <dd>A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('drop')}} event.</dd> -</dl> - -<h2 id="Example">Example</h2> - -<p>An Example of each property, constructor, event type and global event handlers is included in their respective reference page.</p> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName("HTML WHATWG", "#dragevent", "DragEvent")}}</td> - <td>{{Spec2("HTML WHATWG")}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName("HTML5.1", "editing.html#the-dragevent-interface", "DragEvent")}}</td> - <td>{{Spec2("HTML5.1")}}</td> - <td>Initial definition</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - - - -<p>{{Compat("api.DragEvent")}}</p> - -<h2 id="See_also">See also</h2> - -<p>{{page("/en-US/docs/Web/API/DataTransfer", "See also")}}</p> diff --git a/files/ko/web/api/dragevent/index.md b/files/ko/web/api/dragevent/index.md new file mode 100644 index 0000000000..90cba75d26 --- /dev/null +++ b/files/ko/web/api/dragevent/index.md @@ -0,0 +1,82 @@ +--- +title: DragEvent +slug: Web/API/DragEvent +tags: + - API + - DragEvent + - Reference + - drag and drop +browser-compat: api.DragEvent +translation_of: Web/API/DragEvent +--- +{{APIRef("HTML Drag and Drop API")}} + +The **`DragEvent`** interface is a {{domxref("Event","DOM event")}} that represents a drag and drop interaction. The user initiates a drag by placing a pointer device (such as a mouse) on the touch surface and then dragging the pointer to a new location (such as another DOM element). Applications are free to interpret a drag and drop interaction in an application-specific way. + +This interface inherits properties from {{domxref("MouseEvent")}} and {{domxref("Event")}}. + +## Properties + +- {{domxref('DragEvent.dataTransfer')}} {{readonlyInline}} + - : The data that is transferred during a drag and drop interaction. + +## Constructors + +Although this interface has a constructor, it is not possible to create a useful DataTransfer object from script, since {{domxref("DataTransfer")}} objects have a processing and security model that is coordinated by the browser during drag-and-drops. + +- {{domxref("DragEvent.DragEvent", "DragEvent()")}} + - : Creates a synthetic and untrusted DragEvent. + +## Event types + +- {{event('drag')}} + - : This event is fired when an element or text selection is being dragged. +- {{event('dragend')}} + - : This event is fired when a drag operation is being ended (by releasing a mouse button or hitting the escape key). +- {{event('dragenter')}} + - : This event is fired when a dragged element or text selection enters a valid drop target. +- {{event('dragleave')}} + - : This event is fired when a dragged element or text selection leaves a valid drop target. +- {{event('dragover')}} + - : This event is fired continuously when an element or text selection is being dragged and the mouse pointer is over a valid drop target (every 50 ms WHEN mouse is not moving ELSE much faster between 5 ms (slow movement) and 1ms (fast movement) approximately. This firing pattern is different than {{Event("mouseover")}} ). +- {{event('dragstart')}} + - : This event is fired when the user starts dragging an element or text selection. +- {{event('drop')}} + - : This event is fired when an element or text selection is dropped on a valid drop target. + +## GlobalEventHandlers + +- {{domxref('GlobalEventHandlers.ondrag')}} + - : A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('drag')}} event. +- {{domxref('GlobalEventHandlers.ondragend')}} + - : A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('dragend')}} event. +- {{domxref('GlobalEventHandlers.ondragenter')}} + - : A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('dragenter')}} event. +- {{domxref('GlobalEventHandlers.ondragleave')}} + - : A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('dragleave')}} event. +- {{domxref('GlobalEventHandlers.ondragover')}} + - : A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('dragover')}} event. +- {{domxref('GlobalEventHandlers.ondragstart')}} + - : A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('dragstart')}} event. +- {{domxref('GlobalEventHandlers.ondrop')}} + - : A {{domxref('GlobalEventHandlers','global event handler')}} for the {{event('drop')}} event. + +## Example + +An Example of each property, constructor, event type and global event handlers is included in their respective reference page. + +## Specifications + +{{Specifications}} + +## Browser compatibility + +{{Compat}} + +## See also + +- [Drag and drop](/en-US/docs/Web/API/HTML_Drag_and_Drop_API) +- [Drag Operations](/en-US/docs/Web/API/HTML_Drag_and_Drop_API/Drag_operations) +- [Recommended Drag Types](/en-US/docs/Web/API/HTML_Drag_and_Drop_API/Recommended_drag_types) +- [Dragging and Dropping Multiple Items](/en-US/docs/Web/API/HTML_Drag_and_Drop_API/Multiple_items) +- [DataTransfer test - Paste or Drag](https://codepen.io/tech_query/pen/MqGgap) diff --git a/files/ko/web/api/filereader/result/index.html b/files/ko/web/api/filereader/result/index.html deleted file mode 100644 index feb9b02405..0000000000 --- a/files/ko/web/api/filereader/result/index.html +++ /dev/null @@ -1,33 +0,0 @@ ---- -title: FileReader.result -slug: Web/API/FileReader/result -translation_of: Web/API/FileReader/result ---- -<p>{{APIRef("File API")}}</p> - -<h2 id="Summary">Summary</h2> - -<p>파일의 내용을 반환한다. 이 속성은 읽기가 완료 된 후에만 사용 가능 하며 데이터의 형식은 읽기 작업에 어떤 함수가 사용되었는가에 의해 정해진다.</p> - -<h2 id="Syntax">Syntax</h2> - -<pre class="syntaxbox">var file = <em>instanceOfFileReader</em>.result -</pre> - -<h2 id="Value">Value</h2> - -<p>읽기 작업에 사용된 함수에 의해 string 또는 {{domxref("ArrayBuffer")}} 가 된다.</p> - -<h2 id="Browser_Compatibility" name="Browser_Compatibility">Specifications</h2> - -<p>{{page("/en-US/docs/Web/API/FileReader","Specifications")}}</p> - -<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2> - -<p>{{page("/en-US/docs/Web/API/FileReader","Browser compatibility")}}</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li>{{domxref("FileReader")}}</li> -</ul> diff --git a/files/ko/web/api/filereader/result/index.md b/files/ko/web/api/filereader/result/index.md new file mode 100644 index 0000000000..de1f086d34 --- /dev/null +++ b/files/ko/web/api/filereader/result/index.md @@ -0,0 +1,31 @@ +--- +title: FileReader.result +slug: Web/API/FileReader/result +browser-compat: api.FileReader.result +translation_of: Web/API/FileReader/result +--- +{{APIRef("File API")}} + +파일의 내용을 반환한다. 이 속성은 읽기가 완료 된 후에만 사용 가능 하며 데이터의 형식은 읽기 작업에 어떤 함수가 사용되었는가에 의해 정해진다. + +## Syntax + +```js +var file = instanceOfFileReader.result +``` + +## Value + +읽기 작업에 사용된 함수에 의해 string 또는 {{domxref("ArrayBuffer")}} 가 된다. + +## Specifications + +{{Specifications}} + +## Browser compatibility + +{{Compat}} + +## See also + +- {{domxref("FileReader")}} diff --git a/files/ko/web/api/geolocation_api/index.html b/files/ko/web/api/geolocation_api/index.html deleted file mode 100644 index e65181fdda..0000000000 --- a/files/ko/web/api/geolocation_api/index.html +++ /dev/null @@ -1,97 +0,0 @@ ---- -title: Geolocation API -slug: Web/API/Geolocation_API -tags: - - Geolocation API - - Guide - - Intermediate - - Overview -translation_of: Web/API/Geolocation_API ---- -<div>{{securecontext_header}}{{DefaultAPISidebar("Geolocation API")}}</div> - -<p><strong>Geolocation API</strong>는 사용자가 원할 경우 웹 애플리케이션에 위치 정보를 제공할 수 있는 API입니다. 개인정보 보호를 위해, 브라우저는 위치 정보를 제공하기 전에 사용자에게 위치 정보 권한에 대한 확인을 받습니다.</p> - -<p><code>Geolocation</code> 객체를 사용하려는 WebExtension은 매니페스트에 <code>"geolocation"</code> 권한을 추가해야 합니다. 사용자의 운영 체제는 WebExtension이 처음으로 위치 정보를 요청하는 순간 사용자에게 정보 제공 여부를 물어봅니다.</p> - -<h2 id="개념과_사용법">개념과 사용법</h2> - -<p>사용자의 현재 위치를 지도에 표시하거나 위치 기반 개인화 정보를 제공하는 등, 웹 앱에서 위치 정보를 가져와야 하는 경우가 종종 있습니다.</p> - -<p>Geolocation API는 {{domxref("Navigator.geolocation", "navigator.geolocation")}}을 통해 접근합니다. 이 때, 사용자의 브라우저는 위치 정보 접근 권한을 요청하게 되고, 사용자가 허가할 경우 현재 장치에서 사용 가능한 최선의 방법(GPS, WiFi, ...)을 통해 위치를 알아냅니다.</p> - -<p>위의 과정이 끝난 후, 코드에서는 몇 가지 다른 방법으로 위치 정보를 가져올 수 있습니다.</p> - -<ul> - <li>{{domxref("Geolocation.getCurrentPosition()")}}: 장치의 현재 위치를 가져옵니다.</li> - <li>{{domxref("Geolocation.watchPosition()")}}: 장치의 위치가 바뀔 때마다, 자동으로 새로운 위치를 사용해 호출할 처리기 함수를 등록합니다.</li> -</ul> - -<p>두 메서드 모두 최대 세 개의 매개변수를 받습니다.</p> - -<ul> - <li>필수로 지정하는 성공 콜백: 위치 정보를 성공적으로 가져온 경우, 위치 데이터를 담은 {{domxref("GeolocationPosition")}} 객체를 유일한 매개변수로 하여 콜백을 호출합니다.</li> - <li>선택적으로 지정하는 실패 콜백: 위치 정보를 가져오지 못한 경우, 실패 원인을 담은 {{domxref("GeolocationPositionError")}} 객체를 유일한 매개변수로 하여 콜백을 호출합니다.</li> - <li>선택적으로 지정하는 {{domxref("PositionOptions")}} 객체는 위치 정보 회수에 적용할 옵션을 제공합니다.</li> -</ul> - -<p><code>Geolocation</code> 사용법에 대한 추가 정보는 <a href="/ko/docs/WebAPI/Using_geolocation">Geolocation API 사용하기</a> 문서를 참고하세요.</p> - -<h2 id="인터페이스">인터페이스</h2> - -<dl> - <dt>{{domxref("Geolocation")}}</dt> - <dd>Geolocation API의 주요 클래스로서 사용자의 현재 위치를 가져오고, 위치 변경을 감지하고, 이전에 등록했던 감지기를 제거하는 메서드를 담고 있습니다.</dd> - <dt>{{domxref("GeolocationPosition")}}</dt> - <dd>사용자의 위치를 나타냅니다. <code>GeolocationPosition</code> 인스턴스는 {{domxref("Geolocation")}} 객체 메서드의 성공 콜백에 제공되며, 타임스탬프와 함께 {{domxref("GeolocationCoordinates")}} 객체 인스턴스를 포함합니다.</dd> - <dt>{{domxref("GeolocationCoordinates")}}</dt> - <dd>사용자 위치의 좌표를 나타냅니다. <code>GeolocationCoordinates</code> 인스턴스는 위도, 경도 외에도 기타 중요한 관련 정보를 포함합니다.</dd> - <dt>{{domxref("GeolocationPositionError")}}</dt> - <dd><code>GeolocationPositionError</code>는 {{domxref("Geolocation")}} 객체 메서드의 오류 콜백에 제공되며, 오류 코드와 오류 메시지를 담고 있습니다.</dd> - <dt>{{domxref("Navigator.geolocation")}}</dt> - <dd>API로 접근할 수 있는 지점입니다. {{domxref("Geolocation")}} 객체 인스턴스를 반환합니다.</dd> -</dl> - -<h2 id="연관_배열">연관 배열</h2> - -<dl> - <dt>{{domxref("PositionOptions")}}</dt> - <dd>{{domxref("Geolocation.getCurrentPosition()")}}과 {{domxref("Geolocation.watchPosition()")}}에 매개변수로 전달할 옵션을 나타내는 객체입니다.</dd> -</dl> - -<h2 id="예제">예제</h2> - -<p>{{page("/en-US/docs/Web/API/Geolocation_API/Using_the_Geolocation_API","Examples")}}</p> - -<h2 id="명세">명세</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName("Geolocation")}}</td> - <td>{{Spec2("Geolocation")}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="브라우저_호환성">브라우저 호환성</h2> - -<p>{{Compat("api.Geolocation")}}</p> - -<h3 id="가용성">가용성</h3> - -<p>WiFi 기반의 위치 정보는 보통 Google이 제공하므로, 기본 Geolocation API는 중국에서 사용하지 못할 수도 있습니다. 대신 <a href="http://lbsyun.baidu.com/index.php?title=jspopular/guide/geolocation">Baidu</a>, <a href="https://lbs.amap.com/api/javascript-api/guide/services/geolocation#geolocation">Autonavi</a>, <a href="http://lbs.qq.com/tool/component-geolocation.html">Tencent</a> 등 지역 서드파티 제공자가 지원하는 라이브러리를 사용할 수 있습니다. 위 서비스는 WiFi 대신 IP 주소와 지역 앱을 사용해 위치 정보를 개선합니다.</p> - -<h2 id="같이_보기">같이 보기</h2> - -<ul> - <li><a href="/ko/docs/Web/API/Geolocation_API/Using">Geolocation API 사용하기</a></li> - <li><a href="https://www.w3.org/TR/geolocation-API/" rel="external">w3.org의 Geolocation API</a></li> - <li><a href="https://hacks.mozilla.org/2013/10/who-moved-my-geolocation/">Who moved my geolocation?</a> (Hacks 블로그)</li> -</ul> diff --git a/files/ko/web/api/geolocation_api/index.md b/files/ko/web/api/geolocation_api/index.md new file mode 100644 index 0000000000..de93db2ba6 --- /dev/null +++ b/files/ko/web/api/geolocation_api/index.md @@ -0,0 +1,74 @@ +--- +title: Geolocation API +slug: Web/API/Geolocation_API +tags: + - Geolocation API + - Guide + - Intermediate + - Overview +translation_of: Web/API/Geolocation_API +--- +{{securecontext_header}}{{DefaultAPISidebar("Geolocation API")}} + +**Geolocation API**는 사용자가 원할 경우 웹 애플리케이션에 위치 정보를 제공할 수 있는 API입니다. 개인정보 보호를 위해, 브라우저는 위치 정보를 제공하기 전에 사용자에게 위치 정보 권한에 대한 확인을 받습니다. + +`Geolocation` 객체를 사용하려는 WebExtension은 매니페스트에 `"geolocation"` 권한을 추가해야 합니다. 사용자의 운영 체제는 WebExtension이 처음으로 위치 정보를 요청하는 순간 사용자에게 정보 제공 여부를 물어봅니다. + +## 개념과 사용법 + +사용자의 현재 위치를 지도에 표시하거나 위치 기반 개인화 정보를 제공하는 등, 웹 앱에서 위치 정보를 가져와야 하는 경우가 종종 있습니다. + +Geolocation API는 {{domxref("Navigator.geolocation", "navigator.geolocation")}}을 통해 접근합니다. 이 때, 사용자의 브라우저는 위치 정보 접근 권한을 요청하게 되고, 사용자가 허가할 경우 현재 장치에서 사용 가능한 최선의 방법(GPS, WiFi, ...)을 통해 위치를 알아냅니다. + +위의 과정이 끝난 후, 코드에서는 몇 가지 다른 방법으로 위치 정보를 가져올 수 있습니다. + +- {{domxref("Geolocation.getCurrentPosition()")}}: 장치의 현재 위치를 가져옵니다. +- {{domxref("Geolocation.watchPosition()")}}: 장치의 위치가 바뀔 때마다, 자동으로 새로운 위치를 사용해 호출할 처리기 함수를 등록합니다. + +두 메서드 모두 최대 세 개의 매개변수를 받습니다. + +- 필수로 지정하는 성공 콜백: 위치 정보를 성공적으로 가져온 경우, 위치 데이터를 담은 {{domxref("GeolocationPosition")}} 객체를 유일한 매개변수로 하여 콜백을 호출합니다. +- 선택적으로 지정하는 실패 콜백: 위치 정보를 가져오지 못한 경우, 실패 원인을 담은 {{domxref("GeolocationPositionError")}} 객체를 유일한 매개변수로 하여 콜백을 호출합니다. +- 선택적으로 지정하는 {{domxref("PositionOptions")}} 객체는 위치 정보 회수에 적용할 옵션을 제공합니다. + +`Geolocation` 사용법에 대한 추가 정보는 [Geolocation API 사용하기](/ko/docs/WebAPI/Using_geolocation) 문서를 참고하세요. + +## 인터페이스 + +- {{domxref("Geolocation")}} + - : Geolocation API의 주요 클래스로서 사용자의 현재 위치를 가져오고, 위치 변경을 감지하고, 이전에 등록했던 감지기를 제거하는 메서드를 담고 있습니다. +- {{domxref("GeolocationPosition")}} + - : 사용자의 위치를 나타냅니다. `GeolocationPosition` 인스턴스는 {{domxref("Geolocation")}} 객체 메서드의 성공 콜백에 제공되며, 타임스탬프와 함께 {{domxref("GeolocationCoordinates")}} 객체 인스턴스를 포함합니다. +- {{domxref("GeolocationCoordinates")}} + - : 사용자 위치의 좌표를 나타냅니다. `GeolocationCoordinates` 인스턴스는 위도, 경도 외에도 기타 중요한 관련 정보를 포함합니다. +- {{domxref("GeolocationPositionError")}} + - : `GeolocationPositionError`는 {{domxref("Geolocation")}} 객체 메서드의 오류 콜백에 제공되며, 오류 코드와 오류 메시지를 담고 있습니다. +- {{domxref("Navigator.geolocation")}} + - : API로 접근할 수 있는 지점입니다. {{domxref("Geolocation")}} 객체 인스턴스를 반환합니다. + +## 연관 배열 + +- {{domxref("PositionOptions")}} + - : {{domxref("Geolocation.getCurrentPosition()")}}과 {{domxref("Geolocation.watchPosition()")}}에 매개변수로 전달할 옵션을 나타내는 객체입니다. + +## 예제 + +[Geolocation API 사용하기](/ko/docs/Web/API/Geolocation_API/Using_the_Geolocation_API#examples)에서 예제를 확인하세요. + +## 명세 + +{{Specifications("api.Geolocation")}} + +## 브라우저 호환성 + +{{Compat("api.Geolocation")}} + +### 가용성 + +WiFi 기반의 위치 정보는 보통 Google이 제공하므로, 기본 Geolocation API는 중국에서 사용하지 못할 수도 있습니다. 대신 [Baidu](http://lbsyun.baidu.com/index.php?title=jspopular/guide/geolocation), [Autonavi](https://lbs.amap.com/api/javascript-api/guide/services/geolocation#geolocation), [Tencent](http://lbs.qq.com/tool/component-geolocation.html) 등 지역 서드파티 제공자가 지원하는 라이브러리를 사용할 수 있습니다. 위 서비스는 WiFi 대신 IP 주소와 지역 앱을 사용해 위치 정보를 개선합니다. + +## 같이 보기 + +- [Geolocation API 사용하기](/ko/docs/Web/API/Geolocation_API/Using) +- [w3.org의 Geolocation API](https://www.w3.org/TR/geolocation-API/) +- [Who moved my geolocation?](https://hacks.mozilla.org/2013/10/who-moved-my-geolocation/) (Hacks 블로그) diff --git a/files/ko/web/api/geolocation_api/using_the_geolocation_api/index.html b/files/ko/web/api/geolocation_api/using_the_geolocation_api/index.html index 44f644b5d5..b4cb7f1cdf 100644 --- a/files/ko/web/api/geolocation_api/using_the_geolocation_api/index.html +++ b/files/ko/web/api/geolocation_api/using_the_geolocation_api/index.html @@ -106,7 +106,7 @@ const watchID = navigator.geolocation.watchPosition(success, error, options);</p alert(`ERROR(${error.code}): ${error.message}`); };</pre> -<h2 id="예제">예제</h2> +<h2 id="examples">예제</h2> <p>다음 예제는 Geolocation API를 사용해 사용자의 위경도를 가져옵니다. 성공한 경우, 사용자의 위치를 가리키는 <code>openstreetmap.org</code> 링크를 생성해 하이퍼링크에 할당합니다.</p> diff --git a/files/ko/web/api/navigator/battery/index.html b/files/ko/web/api/navigator/battery/index.html index f199519ea9..4a953068db 100644 --- a/files/ko/web/api/navigator/battery/index.html +++ b/files/ko/web/api/navigator/battery/index.html @@ -1,24 +1,32 @@ --- title: window.navigator.battery slug: Web/API/Navigator/battery +tags: + - API + - Battery + - Battery API + - Deprecated + - Device API + - Navigator + - Non-standard + - Property + - Reference +browser-compat: api.Navigator.battery translation_of: Web/API/Navigator/battery --- <p>{{ Apiref() }}</p> -<h2 id="요약">요약</h2> -<p><code>battery 객체는 시스템의 배터리 충전 상태에 대한 정보를 제공합니다. 배터리의 충전 상태가 변화할때 발생하는 이벤트에 대한 처리도 가능 합니다. 이 객체는 </code><a href="/en-US/docs/WebAPI/Battery_Status" title="/en-US/docs/WebAPI/Battery_Status">Battery Status API</a> 의 구현입니다. 보다 자세한 내용, API, 샘플 코드 등은 문서를 참고 해 주세요.</p> +<p><code>battery 객체는 시스템의 배터리 충전 상태에 대한 정보를 제공합니다. 배터리의 충전 상태가 변화할때 발생하는 이벤트에 대한 처리도 가능 합니다. 이 객체는 </code><a href="/en-US/docs/Web/API/Battery_Status_API" title="/en-US/docs/WebAPI/Battery_Status">Battery Status API</a> 의 구현입니다. 보다 자세한 내용, API, 샘플 코드 등은 문서를 참고 해 주세요.</p> <h2 id="Syntax" name="Syntax">문법</h2> <pre class="syntaxbox">var battery = window.navigator.battery;</pre> <h2 id="값">값</h2> <p><code>navigator.battery</code> 는 {{domxref("BatteryManager")}} 객체 입니다.</p> -<h2 id="명세">명세</h2> -<p>{{page("/en-US/docs/Web/API/BatteryManager","Specifications")}}</p> -<h2 id="브라우저_호환">브라우저 호환</h2> -<p style="color: rgb(77, 78, 83);">{{page("/en-US/docs/Web/API/BatteryManager","Browser_compatibility")}}</p> -<p><span style="font-family: Georgia, Times, 'Times New Roman', serif; font-size: 1.628em; font-weight: 700; letter-spacing: -1px; line-height: 22.79199981689453px;">참고</span></p> +<h2>브라우저 호환성</h2> +<p>{{Compat}}</p> +<h2>같이 보기</h2> <ul> <li>{{domxref("BatteryManager")}}</li> - <li><a href="/en-US/docs/WebAPI/Battery_Status" title="/en-US/docs/WebAPI/Battery_Status">Battery Status API</a> 문서</li> - <li><a class="external" href="http://hacks.mozilla.org/2012/02/using-the-battery-api-part-of-webapi/">블로그 - Using the Battery API</a></li> - <li><a class="external" href="http://davidwalsh.name/battery-api">David Walsh 가 쓴 the JavaScript Battery Api</a></li> + <li><a href="/ko/docs/Web/API/Battery_Status_API">Battery Status API</a> 문서</li> + <li><a class="external" href="https://hacks.mozilla.org/2012/02/using-the-battery-api-part-of-webapi/">블로그 - Using the Battery API</a></li> + <li><a class="external" href="https://davidwalsh.name/battery-api">David Walsh 가 쓴 the JavaScript Battery Api</a></li> <li><a href="https://github.com/pstadler/battery.js">battery.js - 경량의 크로스 브라우저 랩퍼(wrapper)</a></li> </ul> diff --git a/files/ko/web/api/network_information_api/index.html b/files/ko/web/api/network_information_api/index.html deleted file mode 100644 index 2dd356b86d..0000000000 --- a/files/ko/web/api/network_information_api/index.html +++ /dev/null @@ -1,47 +0,0 @@ ---- -title: Network Information API -slug: Web/API/Network_Information_API -translation_of: Web/API/Network_Information_API -original_slug: WebAPI/Network_Information ---- -<p>{{ SeeCompatTable() }}</p> -<p>네트워크 정보 API는 사용자 기기의 현재 대역폭이나 과금이 되는 연결인지와 같은 시스템의 연결 정보를 알려줍니다. 이를 이용해서 사용자에게 높은 용량의 콘텐츠를 제공할지 낮은 용량의 콘텐츠를 제공할지 사용자의 연결 상태에 따라서 제공할 수 있습니다. 전체 API는 DOM에 추가된 단일한 객체로 구성되어 있습니다: {{domxref("window.navigator.connection")}}.</p> -<h2 id="연결상태_변경_감지">연결상태 변경 감지</h2> -<p>이 예제는 사용자의 연결상태 변화를 감시합니다. 사용자가 비싼 망에서 싼 망으로 이동할 때 사용자가 추가적인 비용을 지불하지 않게 하기 위해서 전송량을 감소시키는 등과 같은 행동을 할 수 있게 앱이 경고를 하는 일과 비슷합니다.</p> -<pre class="brush: js">var connection = navigator.connection || navigator.mozConnection || navigator.webkitConnection; - -function updateConnectionStatus() { - alert("Connection bandwidth: " + connection.bandwidth + " MB/s"); - if (connection.metered) { - alert("The connection is metered!"); - } -} - -connection.addEventListener("change", updateConnectionStatus); -updateConnectionStatus(); -</pre> -<h2 id="Specifications" name="Specifications">명세</h2> -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{ SpecName('Network Information', '', 'Network Information API') }}</td> - <td>{{ Spec2('Network Information') }}</td> - <td>Initial specification</td> - </tr> - </tbody> -</table> -<h2 id="브라우저_호환성">브라우저 호환성</h2> -<p>{{Page('/en-US/docs/Web/API/window.navigator.connection','Browser compatibility')}}</p> -<h2 id="관련_내용">관련 내용</h2> -<ul> - <li>{{ spec("http://dvcs.w3.org/hg/dap/raw-file/tip/network-api/Overview.html", "Network Information API Specification", "ED") }}</li> - <li><a href="/en/Online_and_offline_events" title="en/Online_and_offline_events">Online and offline events</a></li> - <li>{{domxref("window.navigator.connection")}}</li> -</ul> diff --git a/files/ko/web/api/network_information_api/index.md b/files/ko/web/api/network_information_api/index.md new file mode 100644 index 0000000000..4268aad606 --- /dev/null +++ b/files/ko/web/api/network_information_api/index.md @@ -0,0 +1,54 @@ +--- +title: Network Information API +slug: Web/API/Network_Information_API +tags: + - API + - Experimental + - Network Information API + - Reference + - WebAPI +translation_of: Web/API/Network_Information_API +--- +{{DefaultAPISidebar("Network Information API")}}{{SeeCompatTable}} + +네트워크 정보 API는 사용자 기기의 현재 대역폭이나 과금이 되는 연결인지와 같은 시스템의 연결 정보를 알려줍니다. 이를 이용해서 사용자에게 높은 용량의 콘텐츠를 제공할지 낮은 용량의 콘텐츠를 제공할지 사용자의 연결 상태에 따라서 제공할 수 있습니다. 전체 API는 DOM에 추가된 단일한 객체로 구성되어 있습니다: {{domxref("window.navigator.connection")}}. + +## 연결상태 변경 감지 + +이 예제는 사용자의 연결상태 변화를 감시합니다. 사용자가 비싼 망에서 싼 망으로 이동할 때 사용자가 추가적인 비용을 지불하지 않게 하기 위해서 전송량을 감소시키는 등과 같은 행동을 할 수 있게 앱이 경고를 하는 일과 비슷합니다. + +```js +var connection = navigator.connection || navigator.mozConnection || navigator.webkitConnection; + +function updateConnectionStatus() { + alert("Connection bandwidth: " + connection.bandwidth + " MB/s"); + if (connection.metered) { + alert("The connection is metered!"); + } +} + +connection.addEventListener("change", updateConnectionStatus); +updateConnectionStatus(); +``` + +## 명세 + +| Specification | +| ---------------------------------------------------------- | +| [Network Information API](https://wicg.github.io/netinfo/) | + +## 브라우저 호환성 + +### NetworkInformation + +{{Compat("api.NetworkInformation")}} + +### Navigator.connection + +{{Compat("api.Navigator.connection")}} + +## 같이 보기 + +- {{ spec("http://dvcs.w3.org/hg/dap/raw-file/tip/network-api/Overview.html", "Network Information API Specification", "ED") }} +- [Online and offline events](/en/Online_and_offline_events "en/Online_and_offline_events") +- {{domxref("window.navigator.connection")}} diff --git a/files/ko/web/api/notification/permission/index.html b/files/ko/web/api/notification/permission/index.html deleted file mode 100644 index 30969fb541..0000000000 --- a/files/ko/web/api/notification/permission/index.html +++ /dev/null @@ -1,43 +0,0 @@ ---- -title: Notification.permission -slug: Web/API/Notification/permission -translation_of: Web/API/Notification/permission ---- -<p>{{ ApiRef() }}</p> -<p>{{ SeeCompatTable() }}</p> -<h2 id="Summary" name="Summary">요약</h2> -<p><code>permission</code> 속성은 <span style="line-height: inherit;">웹 알림에 있어서 </span><span style="line-height: inherit;">사용자에 의해 현재 앱에 허가된 현재 권한을 가리킵니다. </span></p> -<h2 id="Syntax" name="Syntax">문법</h2> -<pre class="eval">var <em>permission</em> = Notification.permission; -</pre> -<h3 id="Return_Value" name="Return_Value">값</h3> -<p>다음은 현재 권한을 표현하는 문자열입니다.</p> -<ul> - <li><code>granted</code>: 사용자가 의도하여 어플리케이션이 알림을 보낼 수 있도록 허가.</li> - <li><code>denied</code>: 사용자가 의도하여 어플리케이션이 알림을 보내는 것을 거부.</li> - <li><code>default</code>: 사용자의 결정은 알 수 없으나, 어플리케이션 기본적으로 denied 와 같이 동작할 것 입니다.</li> -</ul> -<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('Web Notifications')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Initial specification.</td> - </tr> - </tbody> -</table> -<h2 id="브라우저_호환">브라우저 호환</h2> -<p>{{Page("/en-US/docs/Web/API/Notification","Browser compatibility")}}</p> -<h2 id="See_also">See also</h2> -<ul> - <li>{{domxref("Notification")}}</li> - <li><a href="/en-US/docs/WebAPI/Using_Web_Notifications" title="/en-US/docs/WebAPI/Using_Web_Notifications">Using Web Notifications</a></li> -</ul> diff --git a/files/ko/web/api/notification/permission/index.md b/files/ko/web/api/notification/permission/index.md new file mode 100644 index 0000000000..f4248e6f1e --- /dev/null +++ b/files/ko/web/api/notification/permission/index.md @@ -0,0 +1,43 @@ +--- +title: Notification.permission +slug: Web/API/Notification/permission +tags: + - API + - Notification + - Notifications + - Notifications API + - Property + - Reference +browser-compat: api.Notification.permission +translation_of: Web/API/Notification/permission +--- +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} + +`permission` 속성은 웹 알림에 있어서 사용자에 의해 현재 앱에 허가된 현재 권한을 가리킵니다. + +## 구문 + +```js +var permission = Notification.permission; +``` + +### 값 + +다음은 현재 권한을 표현하는 문자열입니다. + +- `granted`: 사용자가 의도하여 어플리케이션이 알림을 보낼 수 있도록 허가. +- `denied`: 사용자가 의도하여 어플리케이션이 알림을 보내는 것을 거부. +- `default`: 사용자의 결정은 알 수 없으나, 어플리케이션 기본적으로 denied 와 같이 동작할 것 입니다. + +## 명세 + +{{Specifications}} + +## 브라우저 호환성 + +{{Compat}} + +## 같이 보기 + +- {{domxref("Notification")}} +- [Using Web Notifications](/en-US/docs/WebAPI/Using_Web_Notifications "/en-US/docs/WebAPI/Using_Web_Notifications") diff --git a/files/ko/web/api/notifications_api/using_the_notifications_api/index.html b/files/ko/web/api/notifications_api/using_the_notifications_api/index.html index 4610b8c4b3..db30ece47e 100644 --- a/files/ko/web/api/notifications_api/using_the_notifications_api/index.html +++ b/files/ko/web/api/notifications_api/using_the_notifications_api/index.html @@ -256,7 +256,7 @@ var notification = new Notification('할 일 목록', { body: text, icon: img }) <h2 id="브라우저_호환성">브라우저 호환성</h2> -<p>{{page("/en-US/Web/API/Notification","Browser compatibility")}}</p> +<p>{{Compat("api.Notification")}}</p> <h2 id="참고">참고</h2> diff --git a/files/ko/web/api/screen/index.html b/files/ko/web/api/screen/index.html deleted file mode 100644 index 74772f16d3..0000000000 --- a/files/ko/web/api/screen/index.html +++ /dev/null @@ -1,76 +0,0 @@ ---- -title: Screen -slug: Web/API/Screen -tags: - - API -translation_of: Web/API/Screen ---- -<div>{{APIRef("CSSOM View")}}</div> - -<p>The <code>Screen</code> interface represents a screen, usually the one on which the current window is being rendered.</p> - -<p>Usually it is the one on which the current window is being rendered, obtained using <code>window.screen</code>.</p> - -<h2 id="Example" name="Example">Properties</h2> - -<dl> - <dt>{{domxref("Screen.availTop")}}</dt> - <dd>Specifies the y-coordinate of the first pixel that is not allocated to permanent or semipermanent user interface features.</dd> - <dt>{{domxref("Screen.availLeft")}}</dt> - <dd>Returns the first available pixel available from the left side of the screen.</dd> - <dt>{{domxref("Screen.availHeight")}}</dt> - <dd>Specifies the height of the screen, in pixels, minus permanent or semipermanent user interface features displayed by the operating system, such as the Taskbar on Windows.</dd> - <dt>{{domxref("Screen.availWidth")}}</dt> - <dd>Returns the amount of horizontal space in pixels available to the window.</dd> - <dt>{{domxref("Screen.colorDepth")}}</dt> - <dd>Returns the color depth of the screen.</dd> - <dt>{{domxref("Screen.height")}}</dt> - <dd>Returns the height of the screen in pixels.</dd> - <dt>{{domxref("Screen.left")}}</dt> - <dd>Returns the distance in pixels from the left side of the main screen to the left side of the current screen.</dd> - <dt>{{domxref("Screen.orientation")}}</dt> - <dd>Returns the current orientation of the screen.</dd> - <dt>{{domxref("Screen.pixelDepth")}}</dt> - <dd>Gets the bit depth of the screen.</dd> - <dt>{{domxref("Screen.top")}}</dt> - <dd>Returns the distance in pixels from the top side of the current screen.</dd> - <dt>{{domxref("Screen.width")}}</dt> - <dd>Returns the width of the screen.</dd> - <dt>{{domxref("Screen.mozEnabled")}} {{gecko_minversion_inline("12.0")}}</dt> - <dd>Boolean. Setting to false will turn off the device's screen.</dd> - <dt>{{domxref("Screen.mozBrightness")}} {{gecko_minversion_inline("12.0")}}</dt> - <dd>Controls the brightness of a device's screen. A double between 0 and 1.0 is expected.</dd> -</dl> - -<h3 id="Events_handler">Events handler</h3> - -<dl> - <dt>{{domxref("Screen.onorientationchange")}}</dt> - <dd>A handler for the {{event("orientationchange")}} events.</dd> -</dl> - -<h2 id="Methods">Methods</h2> - -<dl> - <dt>{{domxref("Screen.lockOrientation")}}</dt> - <dd>Lock the screen orientation (only works in fullscreen or for installed apps)</dd> - <dt>{{domxref("Screen.unlockOrientation")}}</dt> - <dd>Unlock the screen orientation (only works in fullscreen or for installed apps)</dd> -</dl> - -<p>Methods inherit from {{domxref("EventTarget")}}</p> - -<p>{{page("/en-US/docs/Web/API/EventTarget","Methods")}}</p> - -<h2 id="Example" name="Example">Example</h2> - -<pre class="brush:js">if (screen.pixelDepth < 8) { - // use low-color version of page -} else { - // use regular, colorful page -} -</pre> - -<h2 id="Specification" name="Specification">Specification</h2> - -<p>CSSOM View</p> diff --git a/files/ko/web/api/screen/index.md b/files/ko/web/api/screen/index.md new file mode 100644 index 0000000000..2d61c9408a --- /dev/null +++ b/files/ko/web/api/screen/index.md @@ -0,0 +1,75 @@ +--- +title: Screen +slug: Web/API/Screen +tags: + - API + - CSSOM View + - Interface + - Reference +browser-compat: api.Screen +translation_of: Web/API/Screen +--- +{{APIRef("CSSOM")}} + +The `Screen` interface represents a screen, usually the one on which the current window is being rendered, and is obtained using {{DOMxRef("window.screen")}}. + +Note that browsers determine which screen to report as current by detecting which screen has the center of the browser window. + +## Properties + +- {{DOMxRef("Screen.availTop")}} {{Non-standard_Inline}} + - : Specifies the y-coordinate of the first pixel that is not allocated to permanent or semipermanent user interface features. +- {{DOMxRef("Screen.availLeft")}} {{Non-standard_Inline}} + - : Returns the first available pixel available from the left side of the screen. +- {{DOMxRef("Screen.availHeight")}} + - : Specifies the height of the screen, in pixels, minus permanent or semipermanent user interface features displayed by the operating system, such as the Taskbar on Windows. +- {{DOMxRef("Screen.availWidth")}} + - : Returns the amount of horizontal space in pixels available to the window. +- {{DOMxRef("Screen.colorDepth")}} + - : Returns the color depth of the screen. +- {{DOMxRef("Screen.height")}} + - : Returns the height of the screen in pixels. +- {{DOMxRef("Screen.left")}} {{Non-standard_Inline}} + - : Returns the distance in pixels from the left side of the main screen to the left side of the current screen. +- {{DOMxRef("Screen.orientation")}} + - : Returns the {{DOMxRef("ScreenOrientation")}} instance associated with this screen. +- {{DOMxRef("Screen.pixelDepth")}} + - : Gets the bit depth of the screen. +- {{DOMxRef("Screen.top")}} {{deprecated_inline}}{{Non-standard_Inline}} + - : Returns the distance in pixels from the top side of the current screen. +- {{DOMxRef("Screen.width")}} + - : Returns the width of the screen. +- {{DOMxRef("Screen.mozEnabled")}} {{Non-standard_Inline}} {{Deprecated_Inline}} + - : Boolean. Setting to false will turn off the device's screen. +- {{DOMxRef("Screen.mozBrightness")}} {{Non-standard_Inline}} {{Deprecated_Inline}} + - : Controls the brightness of a device's screen. A double between 0 and 1.0 is expected. + +### Events handler + +- {{DOMxRef("Screen.onorientationchange")}} {{Deprecated_Inline}} + - : A handler for the {{Event("orientationchange")}} event. + +## Methods + +- {{DOMxRef("Screen.lockOrientation")}} {{Non-standard_Inline}} {{Deprecated_Inline}} + - : Lock the screen orientation (only works in fullscreen or for installed apps) +- {{DOMxRef("Screen.unlockOrientation")}} {{Non-standard_Inline}} {{Deprecated_Inline}} + - : Unlock the screen orientation (only works in fullscreen or for installed apps) + +## Example + +```js +if (screen.pixelDepth < 8) { + // use low-color version of page +} else { + // use regular, colorful page +} +``` + +## Specifications + +{{Specifications}} + +## Browser compatibility + +{{Compat}} |