initial commit

2 files changed, 386 insertions, 0 deletions

diff --git a/files/ko/web/api/htmlcanvaselement/getcontext/index.html b/files/ko/web/api/htmlcanvaselement/getcontext/index.html
new file mode 100644
index 0000000000..89a54a2c1d
--- /dev/null
+++ b/files/ko/web/api/htmlcanvaselement/getcontext/index.html
@@ -0,0 +1,144 @@
+---
+title: HTMLCanvasElement.getContext()
+slug: Web/API/HTMLCanvasElement/getContext
+tags:
+  - API
+  - Canvas
+  - HTMLCanvasElement
+  - 레퍼런스
+  - 메소드
+translation_of: Web/API/HTMLCanvasElement/getContext
+---
+<div>{{APIRef("Canvas API")}}</div>
+
+<p><span class="seoSummary"><strong><code>HTMLCanvasElement.getContext()</code></strong> 메소드는 캔버스의 드로잉 컨텍스트를 반환합니다. 컨텍스트 식별자가 지원되지 않을 경우 {{jsxref("null")}}을 반환합니다.</span></p>
+
+<p>동일한 캔버스 엘리먼트에서 나중에 이 메소드를 호출하면 동일한 <code>contextType</code> 인자와 함께 메소드가 마지막으로 호출되었을 때 반환된 것과 같이 동일한 드로잉 컨텍스트 인스턴스를 반환합니다. 다른 드로잉 컨텍스트 객체를 얻으려면 다른 <code>contextType</code>을 전달하거나 다른 캔버스 엘리먼트에서 메소드를 호출해야 합니다.</p>
+
+<h2 id="구문">구문</h2>
+
+<pre class="syntaxbox">var <em>ctx</em> = <em>canvas</em>.getContext(<em>contextType</em>);
+var <em>ctx</em> = <em>canvas</em>.getContext(<em>contextType</em>, <em>contextAttributes</em>);
+</pre>
+
+<h3 id="파라미터">파라미터</h3>
+
+<dl>
+ <dt><code>contextType</code></dt>
+ <dd>캔버스에 연관된 드로잉 컨텍스트를 정의하는 컨텍스트 식별자를 갖는 {{domxref("DOMString")}}입니다. 가능한 값은 다음과 같습니다.
+ <ul>
+  <li><code>"2d"</code>, 2차원 렌더링 컨텍스트를 나타내는 {{domxref("CanvasRenderingContext2D")}} 객체를 생성하게 합니다.</li>
+  <li><code>"webgl"</code> (또는 <code>"experimental-webgl"</code>), 3차원 렌더링 컨텍스트를 나타내는 {{domxref("WebGLRenderingContext")}} 객체를 생성합니다. 이 컨텍스트는 <a href="https://developer.mozilla.org/ko/docs/Web/WebGL">WebGL</a> 버전 1 (OpenGL ES 2.0)을 구현하는 브라우저에서만 사용가능합니다.</li>
+  <li><code>"webgl2"</code>, 3차원 렌더링 컨텍스트를 나타내는 {{domxref("WebGL2RenderingContext")}} 객체를 생성합니다. 이 컨텍스트는 <a href="https://developer.mozilla.org/ko/docs/Web/WebGL">WebGL</a> 버전 2 (OpenGL ES 3.0)를 구현하는 브라우저에서만 사용가능합니다. {{experimental_inline}}</li>
+  <li><code>"bitmaprenderer"</code>, 캔버스의 컨텐츠를 주어진 {{domxref("ImageBitmap")}}으로 대체하기위한 기능만을 제공하는 {{domxref("ImageBitmapRenderingContext")}}를 생성합니다.</li>
+ </ul>
+
+ <div class="note">
+ <p><strong>노트</strong>: 식별자 <code>"experimental-webgl"</code>은 WebGL의 새로운 구현에서 사용됩니다. 이러한 구현은 테스트 스위트 적합성을 아직 만족하지 못하며, 플랫폼 상의 그래픽 드라이버도 아직 불안정합니다. <a href="https://www.khronos.org/">Khronos Group</a>은 특정 <a href="https://www.khronos.org/registry/webgl/sdk/tests/CONFORMANCE_RULES.txt">적합성 규칙</a>에 따라 WebGL 구현을 인증합니다.</p>
+ </div>
+ </dd>
+ <dt><code>contextAttributes</code></dt>
+ <dd>
+ <p>렌더링 컨텍스트를 생성할 때 몇 가지 컨텍스트 속성을 사용할 수 있습니다. 예를 들면:</p>
+
+ <pre class="brush: js">const gl = canvas.getContext('webgl', {
+  antialias: false,
+  depth: false
+});</pre>
+ 2d 컨텍스트 속성:
+
+ <ul>
+  <li><strong><code>alpha</code></strong>: 캔버스가 알파 채널을 포함하는지를 나타내는 불리언입니다. <code>false</code>로 설정할 경우, 브라우저는 이제 배경이 항상 투명하다는 것을 알기때문에 투명한 컨텐츠나 이미지를 그리는 속도를 높일수 있습니다.</li>
+  <li>{{non-standard_inline}} (Gecko 전용) <strong><code>willReadFrequently</code></strong>: 많은 다시 읽기 작업이 계획되어있는지 여부를 나타내는 불리언입니다. 이는 소프트웨어(하드웨어 가속 대신) 2D 캔버스의 사용을 강제하며 {{domxref("CanvasRenderingContext2D.getImageData", "getImageData()")}} 호출이 빈번할때 메모리를 절약할 수 있습니다. 이 옵션은 <code>gfx.canvas.willReadFrequently.enable</code> 플래그가 <code>true</code>(기본 값이며, B2G/Firefox OS에만 해당) 설정되었을 경우에만 사용가능합니다.</li>
+  <li>{{non-standard_inline}} (Blink only) <strong><code>storage</code></strong>: 어떤 스토리지가 사용되었는지를 나타내는 문자열입니다(기본값은 "persistent").</li>
+ </ul>
+ WebGL 컨텍스트 속성:
+
+ <ul>
+  <li><strong><code>alpha</code></strong>: 캔버스가 알파 버퍼를 포함하는지 여부를 나타내는 불리언입니다.</li>
+  <li><strong><code>antialias</code></strong>: 안티 앨리어싱을 수행할지 여부를 나타내는 불리언입니다.</li>
+  <li><strong><code>depth</code></strong>: 드로잉 버퍼가 최소 16 비트의 깊이 버퍼를 갖는지 여부를 나타내는 불리언입니다.</li>
+  <li><code><strong>failIfMajorPerformanceCaveat</strong></code>: 시스템 성능이 낮을 경우에 컨텍스트를 생성할지 여부를 나타내는 불리언입니다.</li>
+  <li><code><strong>powerPreference</strong></code>: WebGL 컨텍스트에 대해 적합한 GPU 구성이 무엇인지를 나타내는 유저 에이전트에 대한 힌트입니다. 가능한 값은 다음과 같습니다.
+   <ul>
+    <li><code>"default"</code>: 유저 에이전트가 가장 적합한 GPU 구성을 결정하도록 합니다. 기본 값입니다.</li>
+    <li><code>"high-performance"</code>: 전력 소비보다 렌더링 성능을 우선시합니다.</li>
+    <li><code>"low-power"</code>: 렌더링 성능보다 전력 절약을 우선시합니다.</li>
+   </ul>
+  </li>
+  <li><strong><code>premultipliedAlpha</code></strong>: 페이지 컴포지터가 미리 곱해진 알파를 갖는 컬러를 포함하는 드로잉 버퍼를 가정할 것인지 여부를 나타내는 불리언입니다.</li>
+  <li><strong><code>preserveDrawingBuffer</code></strong>: 값이 true일 경우 버퍼는 제거되지 않으며 값이 제거되거나 덮어쓰여지기 전까지 유지됩니다.</li>
+  <li><strong><code>stencil</code></strong>: 드로잉 버퍼가 최소 8 비트의 스텐실 버퍼를 갖는지 여부를 나타내는 불리언입니다.</li>
+ </ul>
+ </dd>
+</dl>
+
+<h3 id="반환_값">반환 값</h3>
+
+<p>{{domxref("RenderingContext")}}는 다음 중 하나입니다.</p>
+
+<ul>
+ <li><code>"2d"</code> 용 {{domxref("CanvasRenderingContext2D")}},</li>
+ <li><code>"webgl"</code> 및 <code>"experimental-webgl"</code> 용 {{domxref("WebGLRenderingContext")}},</li>
+ <li><code>"webgl2"</code> 용 {{domxref("WebGL2RenderingContext")}}</li>
+ <li><code>"bitmaprenderer"</code> 용 {{domxref("ImageBitmapRenderingContext")}}.</li>
+</ul>
+
+<p><code>contextType</code>이 가능한 드로잉 컨텍스트와 일치하지 않으면, <code>null</code>이 반환됩니다.</p>
+
+<h2 id="예시">예시</h2>
+
+<p>다음 {{HTMLElement("canvas")}} 엘리먼트를 고려해볼 때:</p>
+
+<pre class="brush: html">&lt;canvas id="canvas" width="300" height="300"&gt;&lt;/canvas&gt;
+</pre>
+
+<p>다음 코드를 사용해 캔버스의 <code>2d</code> 컨텍스트를 얻을 수 있습니다.</p>
+
+<pre class="brush: js">var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext('2d');
+console.log(ctx); // CanvasRenderingContext2D { ... }
+</pre>
+
+<p>이제 캔버스에 대한 <a href="/ko/docs/Web/API/CanvasRenderingContext2D">2D 렌더링 컨텍스트</a>를 갖고 있으며 이 안에 그릴 수 있습니다.</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', "scripting.html#dom-canvas-getcontext", "HTMLCanvasElement.getContext")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>최신 스냅샷 {{SpecName('HTML5 W3C')}} 이후에 변경사항 없음</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "semantics-scripting.html#dom-htmlcanvaselement-getcontext", "HTMLCanvasElement.getContext")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "scripting-1.html#dom-canvas-getcontext", "HTMLCanvasElement.getContext")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>초기 정의를 포함하는 {{SpecName('HTML WHATWG')}}의 스냅샷.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+
+
+<p>{{Compat("api.HTMLCanvasElement.getContext")}}</p>
+
+<h2 id="함께_보기">함께 보기</h2>
+
+<ul>
+ <li>이를 정의하는 인터페이스 {{domxref("HTMLCanvasElement")}}.</li>
+ <li>{{domxref("OffscreenCanvas.getContext()")}}</li>
+ <li>사용 가능한 렌더링 컨텍스트: {{domxref("CanvasRenderingContext2D")}}, {{domxref("WebGLRenderingContext")}}, {{domxref("WebGL2RenderingContext")}}, {{domxref("ImageBitmapRenderingContext")}}.</li>
+</ul>
diff --git a/files/ko/web/api/htmlcanvaselement/index.html b/files/ko/web/api/htmlcanvaselement/index.html
new file mode 100644
index 0000000000..cd8c23eb12
--- /dev/null
+++ b/files/ko/web/api/htmlcanvaselement/index.html
@@ -0,0 +1,242 @@
+---
+title: HTMLCanvasElement
+slug: Web/API/HTMLCanvasElement
+translation_of: Web/API/HTMLCanvasElement
+---
+<div>
+<div>{{APIRef("Canvas API")}}</div>
+</div>
+
+<p><strong><code>HTMLCanvasElement</code></strong> 인터페이스는 &lt;canvas&gt; 요소의 레이아웃이나 프레젠테이션을 조작하는 여러 프로퍼티와 메서드들을 제공합니다. 또한 <code>HTMLCanvasElement</code> 인터페이스는 {{domxref("HTMLElement")}} 인터페이스의 여러 프로퍼티와 메서드들을 상속받습니다.</p>
+
+<h2 id="프로퍼티">프로퍼티</h2>
+
+<p><em>부모객체인 <em>{{domxref("HTMLElement")}} 로</em>부터 프로퍼티를 상속받음. </em></p>
+
+<dl>
+ <dt>{{domxref("HTMLCanvasElement.height")}}</dt>
+ <dd>는 {{HTMLElement("canvas")}} 요소에서 HTML 속성인 {{htmlattrxref("height", "canvas")}}를 반영하는 양의 정수이며, CSS의 픽셀값으로 해석되어집니다. 속성값이 주어지지 않거나, 음수와 같이 올바르지 않은 값이 주어진 경우에는 기본 값인 150이 사용됩니다.</dd>
+ <dt>{{domxref("HTMLCanvasElement.mozOpaque")}} {{non-standard_inline}}</dt>
+ <dd>는 {{HTMLElement("canvas")}} 요소에서 HTML 속성인 {{htmlattrxref("moz-opaque", "canvas")}}를 반영하는 {{jsxref("Boolean")}} 객체입니다. 이는 &lt;canvas&gt;에게 반투명이 인자로 사용될지에 대한 여부를 알려줍니다. 만약 반투명 요소가 없다면, &lt;canvas&gt;의 성능이 최적화될 수 있습니다.</dd>
+ <dt>{{domxref("HTMLCanvasElement.width")}}</dt>
+ <dd>는 {{HTMLElement("canvas")}} 요소에서 HTML 속성인 {{htmlattrxref("width", "canvas")}}를 반영하는 양의 정수이며, CSS의 픽셀값으로 해석되어집니다.  속성값이 주어지지 않거나, 음수와 같이 올바르지 않은 값이 주어진 경우에는 기본 값인 300이 사용됩니다.</dd>
+ <dt>{{domxref("HTMLCanvasElement.mozPrintCallback")}}{{non-standard_inline}}</dt>
+ <dd>는 페이지가 프린트 되는 경우 호출되는 함수입니다. 사용자는 해당 객체에 특정 자바스크립트 함수를 등록함으로써, 만약 프린터가 사용되는 경우 &lt;canvas&gt;를 더욱 고해상도로 다시 그리게 할 수 있습니다. 기본적으로 null 값을 갖습니다. <a href="https://blog.mozilla.org/labs/2012/09/a-new-way-to-control-printing-output/">다음의 블로그 글을 참조하세요.</a></dd>
+ <dt> </dt>
+</dl>
+
+<h2 id="메서드">메서드</h2>
+
+<p><em>부모객체인 {{domxref("HTMLElement")}} 로부터 메서드를 상속받음.</em></p>
+
+<dl>
+ <dt>{{domxref("HTMLCanvasElement.captureStream()")}} {{experimental_inline}}</dt>
+ <dd>&lt;canvas&gt; 상의 화면을 실시간 비디오로 캡처할 수 있는 {{domxref("CanvasCaptureMediaStream")}} 을 반환합니다.</dd>
+ <dt>{{domxref("HTMLCanvasElement.getContext()")}}</dt>
+ <dd>&lt;canvas&gt; 상의 드로잉 컨텍스트를 반환합니다. 만약 컨텍스트 ID가 지원되지 않는 경우 null값을 반환합니다. 드로잉 컨텍스트는 &lt;canvas&gt; 상에 그림을 그릴 수 있게 해줍니다.  getContext를 <code>"2d"</code> 를 매개 변수로 호출한다면 {{domxref("CanvasRenderingContext2D")}} 객체를 반환할 것이며, <code>"experimental-webgl"</code> (또는 <code>"webgl"</code>) 를 매개 변수로 호출한다면 {{domxref("WebGLRenderingContext")}} 객체를 반환할 것입니다. 후자의 컨텍스트의 경우 <a href="/en-US/docs/Web/WebGL">WebGL</a> 이 구현된 브라우저에서만 사용 가능합니다.</dd>
+ <dt>{{domxref("HTMLCanvasElement.toDataURL()")}}</dt>
+ <dd><code>type</code> 파라미터에서 지정하고 있는 포맷(기본: png) 의 이미지를 나타내는 data-URL을 반환합니다. 반환된 이미지는 96dpi의 해상도를 갖습니다.</dd>
+ <dt>{{domxref("HTMLCanvasElement.toBlob()")}}</dt>
+ <dd>&lt;canvas&gt;가 포함하고 있는 이미지를 나타내는 {{domxref("Blob")}} 객체를 생성합니다. 이 파일은 사용자의 브라우저에 따라 디스크나 메모리에 캐싱되거나 저장될 수 있습니다.</dd>
+ <dt>{{domxref("HTMLCanvasElement.transferControlToOffscreen()")}} {{experimental_inline}}</dt>
+ <dd>메인 쓰레드나 워커 쓰레드에서 {{domxref("OffscreenCanvas")}} 객체에게 제어 권한을 넘깁니다.</dd>
+ <dt>{{domxref("HTMLCanvasElement.mozGetAsFile()")}} {{non-standard_inline}} {{deprecated_inline}}</dt>
+ <dd>&lt;canvas&gt;가 포함하고 있는 이미지를 나타내는 {{domxref("File")}} 객체를 반환합니다. 이 파일은 메모리 기반의 파일이며, <code>name</code> 의 이름을 갖습니다. 만약 <code>type</code> 이 지정되지 않는다면, 이미지는 기본적으로 <code>image/png</code>의 타입을 갖게 될 것입니다.</dd>
+</dl>
+
+<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('Media Capture DOM Elements', '#html-media-element-media-capture-extensions', 'HTMLCanvasElement')}}</td>
+   <td>{{Spec2('Media Capture DOM Elements')}}</td>
+   <td><code>captureStream()</code> 메서드 추가하기</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "#the-canvas-element", "HTMLCanvasElement")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>
+    <p><code>getContext()</code> 메서드가 이제 단순히 객체를 반환하지 않고 {{domxref("RenderingContext")}} 를 반환함. <br>
+     <code>다음의 메서드가 추가됨: probablySupportsContext()</code>, <code>setContext()</code> 와 <code>transferControlToProxy()</code></p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "scripting-1.html#the-canvas-element", "HTMLCanvasElement")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "scripting-1.html#the-canvas-element", "HTMLCanvasElement")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>초기 정의</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support (<code>2D</code> context)</td>
+   <td>4.0</td>
+   <td>{{CompatGeckoDesktop('1.9.2')}}</td>
+   <td>9.0</td>
+   <td>9.0 [1]</td>
+   <td>3.1</td>
+  </tr>
+  <tr>
+   <td><code>toBlob()</code></td>
+   <td>50</td>
+   <td>{{CompatGeckoDesktop('19')}} [2]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}} (bug <a href="https://bugs.webkit.org/show_bug.cgi?id=71270">71270</a>)</td>
+  </tr>
+  <tr>
+   <td><code>probablySupportsContext()</code>,<br>
+    <code>setContext()</code>,<br>
+    <code>transferControlToProxy()</code> {{experimental_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>mozGetAsFile()</code> {{non-standard_inline}} {{deprecated_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop('2')}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>captureStream()</code> {{experimental_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop('41')}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>transferControlToOffscreen()</code> {{experimental_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop(44)}} [3]</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support (<code>2D</code> context)</td>
+   <td>2.1</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.0 [1]</td>
+   <td>3.2</td>
+  </tr>
+  <tr>
+   <td><code>webgl</code> context</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}} as <code>experimental-webgl</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>toBlob()</code></td>
+   <td>{{CompatNo}} (bug <a href="http://crbug.com/67587">67587</a>)</td>
+   <td>50</td>
+   <td>{{CompatGeckoMobile('18')}} [2]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}} (bug <a href="https://bugs.webkit.org/show_bug.cgi?id=71270">71270</a>)</td>
+  </tr>
+  <tr>
+   <td><code>probablySupportsContext()</code>,<br>
+    <code>setContext()</code>,<br>
+    <code>transferControlToProxy() </code>{{experimental_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>mozGetAsFile()</code> {{non-standard_inline}} {{deprecated_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile('2')}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>captureStream() </code>{{experimental_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile('41')}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>transferControlToOffscreen()</code> {{experimental_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile(44)}} [3]</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Opera Mini 5.0 and later has partial support.</p>
+
+<p>[2] Support for the third parameter, has been added in Gecko 25 only: when used with the <code>"image/jpeg"</code> type, this argument specifies the image quality.</p>
+
+<p>[3] This feature is behind a feature preference setting. In about:config, set <code>gfx.offscreencanvas.enabled</code> to <code>true</code>.</p>
+
+<h2 id="참조">참조</h2>
+
+<ul>
+ <li>이 인터페이스를 구현한 HTML 요소: {{HTMLElement("canvas")}}.</li>
+</ul>