1 files changed, 23 insertions, 1 deletions
diff --git a/files/ko/web/api/intersectionobserver/observe/index.html b/files/ko/web/api/intersectionobserver/observe/index.html
index fdccd48325..5c10623363 100644
--- a/files/ko/web/api/intersectionobserver/observe/index.html
+++ b/files/ko/web/api/intersectionobserver/observe/index.html
@@ -31,7 +31,29 @@ translation_of: Web/API/IntersectionObserver/observe
 
 <h2 id="Examples">Examples</h2>
 
-<p>&lt;&lt;&lt;...&gt;&gt;&gt;</p>
+<p>IntersectionObserver 를 등록한다</p>
+
+<pre>
+// IntersectionObserver 를 등록한다.
+const io = new IntersectionObserver(entries => {
+  entries.forEach(entry => {
+    // 관찰 대상이 viewport 안에 들어온 경우 'tada' 클래스를 추가
+    if (entry.intersectionRatio > 0) {
+      entry.target.classList.add('tada');
+    }
+    // 그 외의 경우 'tada' 클래스 제거
+    else {
+      entry.target.classList.remove('tada');
+    }
+  })
+})
+
+// 관찰할 대상을 선언하고, 해당 속성을 관찰시킨다.
+const boxElList = document.querySelectorAll('.box');
+boxElList.forEach((el) => {
+  io.observe(el);
+})
+</pre>
 
 <h2 id="Specifications">Specifications</h2>