[윈도우 크기와 스크롤] 번역 완료 #830

benz-e-class · 2020-09-02T17:42:25Z

Pull Request 체크리스트

TODO

번역 규칙을 확인하셨나요?
- 줄 바꿈과 단락을 '원문과 동일하게' 유지하셨나요?
- 맞춤법 검사기로 맞춤법을 확인하셨나요?
- 마크다운 문법에 사용되는 공백(스페이스), 큰따옴표("), 작은따옴표('), 대시(-), 백틱(`) 등의 특수문자는 그대로 두셨나요?
로컬 서버 세팅 후 최종 결과물을 확인해 보셨나요?
PR 하나엔 번역문 하나만 넣으셨나요?
의미 있는 커밋 메시지를 작성하셨나요?
- 예시
  - [프락시] 번역
  - [프락시] 과제 번역
  - [if문과 조건부 연산자 '?'] 리뷰
  - [주석] 2차 리뷰
  - [Date 객체와 날짜] 번역

benz-e-class · 2020-09-02T17:52:09Z

@Violet-Bora-Lee 리뷰 요청드립니다.

Violet-Bora-Lee

모범사례 한번 정독하시고 다시 done 코멘트 남겨주세요.

Violet-Bora-Lee · 2020-09-03T13:20:58Z

2-ui/1-document/10-size-and-scroll-window/article.md

@@ -1,50 +1,50 @@
-# Window sizes and scrolling
+# 윈도우의 크기와 스크롤


Suggested change

# 윈도우의 크기와 스크롤

# 윈도우 크기와 스크롤

아래 글 한번 확인해주세요.
https://m.blog.naver.com/ojhnews/220840570533

Violet-Bora-Lee · 2020-09-03T13:20:58Z

2-ui/1-document/10-size-and-scroll-window/article.md


-How do we find the width and height of the browser window? How do we get the full width and height of the document, including the scrolled out part? How do we scroll the page using JavaScript?
+우리는 어떻게 브라우저 윈도우의 너비와 높이를 찾을 수 있을까요? 우리는 스크롤 된 부분을 포함한 문서의 전체 너비와 높이를 어떻게 얻을 수 있을까요? 우리는 자바스크립트를 이용하여 어떻게 페이지 스크롤을 할 수 있을까요?


모범 사례 확인 부탁드릴게요.

https://github.com/javascript-tutorial/ko.javascript.info/wiki/%EB%B2%88%EC%97%AD-%EB%AA%A8%EB%B2%94-%EC%82%AC%EB%A1%80#we-you-she-he%EB%93%B1%EC%9D%98-%EC%9D%B8%EC%B9%AD%EB%8C%80%EB%AA%85%EC%82%AC%EB%8A%94-%EB%B2%88%EC%97%AD%ED%95%98%EC%A7%80-%EC%95%8A%EC%8A%B5%EB%8B%88%EB%8B%A4

인칭 대명사 번역에 관한 사항은 이제 코멘트 안남길게요. 아래쪽에 있는 내용들을 수정부탁드립니다.

Violet-Bora-Lee · 2020-09-03T13:20:58Z

2-ui/1-document/10-size-and-scroll-window/article.md


-For most such requests, we can use the root document element `document.documentElement`, that corresponds to the `<html>` tag. But there are additional methods and peculiarities important enough to consider.
+대부분의 경우, 우리는 대부분 `<html>` 태그에 해당하는 문서의 루트 요소인 `document.documentElement`를 사용할 수 있습니다. 그러나, 부가적인 방법과 중요하게 고려해야 할 특성도 있습니다.


Suggested change

대부분의 경우, 우리는 대부분 `<html>` 태그에 해당하는 문서의 루트 요소인 `document.documentElement`를 사용할 수 있습니다. 그러나, 부가적인 방법과 중요하게 고려해야 할 특성도 있습니다.

대부분의 경우 `document.documentElement`를 사용하면 `<html>` 태그에 해당하는 문서의 루트 요소에 접근할 수 있습니다. 그런데 `document.documentElement`를 사용하는것 말고도 루트 요소에 접근할 수 있는 방법이 여러가지가 있습니다. 그리고 이때 고려해야 할 특성도 있습니다.

Violet-Bora-Lee · 2020-09-03T13:20:58Z

2-ui/1-document/10-size-and-scroll-window/article.md


-## Width/height of the window
+## 윈도우의 너비/높이


https://github.com/javascript-tutorial/ko.javascript.info/wiki/%EB%B2%88%EC%97%AD-%EB%AA%A8%EB%B2%94-%EC%82%AC%EB%A1%80#%EC%A7%9D%EC%9D%84-%EC%9D%B4%EB%A3%A8%EB%8A%94-%EB%8B%A8%EC%96%B4%EB%A5%BC-%EC%9D%B4%EC%9D%84-%EB%95%8C%EB%8A%94-%EA%B0%80%EC%9A%B4%EB%8E%83%EC%A0%90-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0

모범 사례 확인해주세요

Violet-Bora-Lee · 2020-09-03T13:20:58Z

2-ui/1-document/10-size-and-scroll-window/article.md


-To get window width and height we can use `clientWidth/clientHeight` of `document.documentElement`:
+우리는 윈도우의 너비와 높이를 구하기 위해서 `document.documentElement`의 `clientWidth/clientHeight`를 사용할 수 있습니다.:


https://github.com/javascript-tutorial/ko.javascript.info/wiki/%EB%B2%88%EC%97%AD-%EB%AA%A8%EB%B2%94-%EC%82%AC%EB%A1%80#%EC%8C%8D%EC%A0%90%EC%9D%80-%EA%B1%B0%EC%9D%98-%EC%82%AC%EC%9A%A9%ED%95%98%EC%A7%80-%EC%95%8A%EC%8A%B5%EB%8B%88%EB%8B%A4

모범 사례 확인해주세요.

쌍점 관련해서는 이제 코멘트 안남길게요.

전체적으로 반영 부탁드려요.

Violet-Bora-Lee · 2020-09-03T13:20:58Z

2-ui/1-document/10-size-and-scroll-window/article.md

-````warn header="Not `window.innerWidth/Height`"
-Browsers also support properties `window.innerWidth/innerHeight`. They look like what we want. So why not to use them instead?
+````warn header="`window.innerWidth/Height`은 안됩니다."
+브라우저들은 또한 `window.innerWidth/innerHeight` 속성도 제공합니다. 그것들은 우리가 원한 것처럼 보여집니다. 그러나 왜 그것들을 대신 사용하지 않을까요?


https://github.com/javascript-tutorial/ko.javascript.info/wiki/%EB%B2%88%EC%97%AD-%EB%AA%A8%EB%B2%94-%EC%82%AC%EB%A1%80#%EC%96%B4%EC%83%89%ED%95%98%EC%A7%80-%EC%95%8A%EB%8B%A4%EB%A9%B4-%EB%8B%A8%EC%88%98%ED%98%95%EC%9D%84-%EC%82%AC%EC%9A%A9%ED%95%A9%EC%8B%9C%EB%8B%A4

https://github.com/javascript-tutorial/ko.javascript.info/wiki/%EB%B2%88%EC%97%AD-%EB%AA%A8%EB%B2%94-%EC%82%AC%EB%A1%80#%EB%8C%80%EB%AA%85%EC%82%AC%EB%8A%94-%EB%AA%85%ED%99%95%ED%95%98%EA%B2%8C

모범사례 확인 부탁드립니다.

Suggested change

브라우저들은 또한 `window.innerWidth/innerHeight` 속성도 제공합니다. 그것들은 우리가 원한 것처럼 보여집니다. 그러나 왜 그것들을 대신 사용하지 않을까요?

브라우저는 `clientWidth/clientHeight`말고 `window.innerWidth/innerHeight` 프로퍼티도 제공합니다. `window.innerWidth/innerHeight`만으로도 우리가 원하는 작업을 충분히 할 수 있을 것 같긴 합니다. 그런데 왜 `window.innerWidth`와 `innerHeight`를 사용하지 말라고 했을까요?

Violet-Bora-Lee · 2020-09-03T13:20:58Z

2-ui/1-document/10-size-and-scroll-window/article.md


-If there exists a scrollbar, and it occupies some space, `clientWidth/clientHeight` provide the width/height without it (subtract it). In other words, they return width/height of the visible part of the document, available for the content.
+만약 스크롤 바가 있고, 스크롤 바가 공간을 어느 정도 차지하는 경우, `clientWidth/clientHeight`는 스크롤 바 공간이 없는 너비/높이를 제공할 것입니다. (스크롤 바 공간을 제외합니다) 다시 말하면, 그것들은 문서에서 보이는 부분의 너비/높이를 반환하고, 콘텐츠를 위해 사용할 수 있습니다.


https://github.com/javascript-tutorial/ko.javascript.info/wiki/%EB%B2%88%EC%97%AD-%EB%AA%A8%EB%B2%94-%EC%82%AC%EB%A1%80#if%EB%8A%94-%EC%83%9D%EB%9E%B5%ED%95%A0-%EC%88%98%EB%8F%84-%EC%9E%88%EC%8A%B5%EB%8B%88%EB%8B%A4

https://github.com/javascript-tutorial/ko.javascript.info/wiki/%EB%B2%88%EC%97%AD-%EB%AA%A8%EB%B2%94-%EC%82%AC%EB%A1%80#%EA%B4%84%ED%98%B8-%EC%95%88%EC%9D%98-%EB%AC%B8%EC%9E%A5

Violet-Bora-Lee · 2020-09-03T13:20:58Z

2-ui/1-document/10-size-and-scroll-window/article.md


-If there's a scrollbar, and it occupies some space, then these two lines show different values:
+스크롤 바가 있고, 스크롤 바가 공간을 어느 정도 차지한다면, 아래 두 줄은 다른 값을 보여줍니다:


https://github.com/javascript-tutorial/ko.javascript.info/wiki/%EB%B2%88%EC%97%AD-%EB%AA%A8%EB%B2%94-%EC%82%AC%EB%A1%80#%EC%89%BC%ED%91%9C%EB%A5%BC-%EB%AA%A8%EB%91%90-%EC%98%AE%EA%B8%B8-%ED%95%84%EC%9A%94%EB%8A%94-%EC%97%86%EC%8A%B5%EB%8B%88%EB%8B%A4

javascript-translate-bot · 2020-09-03T13:21:01Z

Please make the requested changes. After it, add a comment "/done".
Then I'll ask for a new review 👻

benz-e-class · 2020-09-07T15:39:03Z

@Violet-Bora-Lee done

Violet-Bora-Lee · 2020-09-09T00:18:45Z

불필요한 커밋들부터 삭제해주시면 리뷰 진행하겠습니다.

benz-e-class · 2020-09-09T01:00:34Z

@Violet-Bora-Lee 지웠습니다.

Violet-Bora-Lee

반 정도 리뷰 마쳤는데, 아직 모범사례 숙지가 안되신 것 같아
정독 후 재 리뷰 요청주시기 바랍니다.

Violet-Bora-Lee · 2020-09-10T11:44:44Z

2-ui/1-document/10-size-and-scroll-window/article.md


-For most such requests, we can use the root document element `document.documentElement`, that corresponds to the `<html>` tag. But there are additional methods and peculiarities important enough to consider.
+대부분, `document.documentElement`를 사용하면 `<html>` 태그에 해당하는 문서의 루트 요소에 접근할 수 있습니다. 그리고 이 때, 중요하게 고려해야 할 특성도 있습니다.


the root document element는 document.documentElement를 수식하는 말인데요, 오역인것같습니다

additional methods 번역 누락

Violet-Bora-Lee · 2020-09-10T11:44:44Z

2-ui/1-document/10-size-and-scroll-window/article.md


-To get window width and height we can use `clientWidth/clientHeight` of `document.documentElement`:
+윈도우 너비와 높이를 구하기 위해서 `document.documentElement`의 `clientWidth/clientHeight`를 사용할 수 있습니다.


https://github.com/javascript-tutorial/ko.javascript.info/wiki/%EB%B2%88%EC%97%AD-%EB%AA%A8%EB%B2%94-%EC%82%AC%EB%A1%80#%EC%A7%9D%EC%9D%84-%EC%9D%B4%EB%A3%A8%EB%8A%94-%EB%8B%A8%EC%96%B4%EB%A5%BC-%EC%9D%B4%EC%9D%84-%EB%95%8C%EB%8A%94-%EA%B0%80%EC%9A%B4%EB%8E%83%EC%A0%90-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0

Violet-Bora-Lee · 2020-09-10T11:44:44Z

2-ui/1-document/10-size-and-scroll-window/article.md


-If there exists a scrollbar, and it occupies some space, `clientWidth/clientHeight` provide the width/height without it (subtract it). In other words, they return width/height of the visible part of the document, available for the content.
+스크롤 바가 있고 스크롤 바가 공간을 어느 정도 차지하는 경우 `clientWidth/clientHeight`는 스크롤 바 공간이 없는 너비/높이를 제공할 것입니다. (스크롤 바 공간을 제외합니다) 다시 말하면, `clientWidth/clientHeight`는 문서에서 보이는 부분의 너비·높이를 반환하고, 콘텐츠에 사용할 수 있습니다.


https://github.com/javascript-tutorial/ko.javascript.info/wiki/%EB%B2%88%EC%97%AD-%EB%AA%A8%EB%B2%94-%EC%82%AC%EB%A1%80#%EC%A7%9D%EC%9D%84-%EC%9D%B4%EB%A3%A8%EB%8A%94-%EB%8B%A8%EC%96%B4%EB%A5%BC-%EC%9D%B4%EC%9D%84-%EB%95%8C%EB%8A%94-%EA%B0%80%EC%9A%B4%EB%8E%83%EC%A0%90-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0

http://m.blog.naver.com/ojhnews/220840570533
문장 내 '것'은 불필요해보입니다

Violet-Bora-Lee · 2020-09-10T11:44:44Z

2-ui/1-document/10-size-and-scroll-window/article.md


-...And `window.innerWidth/innerHeight` include the scrollbar.
+...그리고 `window.innerWidth/innerHeight`는 스크롤 바를 포함하고 있습니다.


지난주에 같이 리뷰하면서 문장 맨 앞 '...'은 빼달라고 부탁드렸습니다

Violet-Bora-Lee · 2020-09-10T11:44:44Z

2-ui/1-document/10-size-and-scroll-window/article.md

 ```

-In most cases we need the *available* window width: to draw or position something. That is: inside scrollbars if there are any. So we should use `documentElement.clientHeight/Width`.
+대부분의 경우 무언가를 그리거나 배치하기 위해 *이용할 수 있는* 창 너비값이 필요합니다. 즉, 스크롤 바가 있으면 `documentElement.clientHeight/Width`를 반드시 사용해야만 합니다.


대부분의 경우 무언가를 그리거나 배치하기 위해 이용할 수 있는 창 너비값이 필요합니다.
이 문장이 이해가 잘 안되네요. 누군가 같이 일하는 분께 읽어봐 달라고 해주세요.

Violet-Bora-Lee · 2020-09-10T11:44:44Z

2-ui/1-document/10-size-and-scroll-window/article.md


-Theoretically, as the root document element is `document.documentElement`, and it encloses all the content, we could measure document full size as `document.documentElement.scrollWidth/scrollHeight`.
+이론적으로 문서의 루트 요소가 `document.documentElement`이고 `document.documentElement`가 모든 콘텐츠를 둘러싸므로, 문서의 전체 크기를 `document.documentElement.scrollWidth/scrollHeight`를 통해 측정할 수 있습니다.


Suggested change

이론적으로 문서의 루트 요소가 `document.documentElement`이고 `document.documentElement`가 모든 콘텐츠를 둘러싸므로, 문서의 전체 크기를 `document.documentElement.scrollWidth/scrollHeight`를 통해 측정할 수 있습니다.

이론적으로 문서의 루트 요소가 `document.documentElement`이고 `document.documentElement`가 모든 콘텐츠를 둘러싸므로, 문서 전체 크기는 `document.documentElement.scrollWidth`, `document.documentElement.scrollHeight`를 사용해 측정할 수 있습니다.

Violet-Bora-Lee · 2020-09-10T11:44:44Z

2-ui/1-document/10-size-and-scroll-window/article.md


-But on that element, for the whole page, these properties do not work as intended. In Chrome/Safari/Opera if there's no scroll, then `documentElement.scrollHeight` may be even less than  `documentElement.clientHeight`! Sounds like a nonsense, weird, right?
+그러나 페이지 전체로 봤을 때, `document.documentElement.scrollWidth/scrollHeight` 프로퍼티는 의도대로 동작하지 않을 수 있습니다. Chrome/Safari/Opera 브라우저에서는 스크롤이 없는 경우 `documentElement.scrollHeight`의 값은 `documentElement.clientHeight`값보다 작을 수 있습니다! 말도 안 되는 소리 같네요. 이상하죠?


https://github.com/javascript-tutorial/ko.javascript.info/wiki/%EB%B2%88%EC%97%AD-%EB%AA%A8%EB%B2%94-%EC%82%AC%EB%A1%80#%EC%A7%9D%EC%9D%84-%EC%9D%B4%EB%A3%A8%EB%8A%94-%EB%8B%A8%EC%96%B4%EB%A5%BC-%EC%9D%B4%EC%9D%84-%EB%95%8C%EB%8A%94-%EA%B0%80%EC%9A%B4%EB%8E%83%EC%A0%90-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0

모범사례 보시고 수정해주세요.

이 부분에 대해선 코멘트가 중복되어 더이상 달지 않겠습니다.

Violet-Bora-Lee · 2020-09-10T11:44:44Z

2-ui/1-document/10-size-and-scroll-window/article.md


-To reliably obtain the full document height, we should take the maximum of these properties:
+신뢰할 수 있는 문서의 전체 높이 값을 얻으려면 아래 프로퍼티 중 최댓값을 얻어와야 합니다.


신뢰할 수 있는 문서의 전체 높이 값 <-- 이렇게 번역하면
'신뢰할 수 있는 문서'의 전체 높이 값이 되어버리네요.
신뢰 여부와 상관 없이 정확한(신뢰할 수 잇는 ) 높이 값을 얻는게 목적이므로 수정부탁드립니다.

Violet-Bora-Lee · 2020-09-10T11:44:44Z

2-ui/1-document/10-size-and-scroll-window/article.md

@@ -53,104 +53,104 @@ let scrollHeight = Math.max(
  document.body.clientHeight, document.documentElement.clientHeight
 );

-alert('Full document height, with scrolled out part: ' + scrollHeight);
+alert('스크롤 아웃 부분이 포함된 전체 문서 높이: ' + scrollHeight);


스크롤 아웃에서 '아웃' 번역부탁드립니다

Violet-Bora-Lee · 2020-09-10T11:44:44Z

2-ui/1-document/10-size-and-scroll-window/article.md

 ```

-Why so? Better don't ask. These inconsistencies come from ancient times, not a "smart" logic.
+왜 그럴까요? 묻지 않는 것이 좋습니다. "똑똑한" 로직이 아닌 이 모순은 오래전부터 시작되었습니다.


https://github.com/javascript-tutorial/ko.javascript.info/wiki/%EB%B2%88%EC%97%AD-%EB%AA%A8%EB%B2%94-%EC%82%AC%EB%A1%80#%EA%B0%95%EC%A1%B0%EC%9D%B8%EC%9A%A9%EC%8B%9C-%EC%82%AC%EC%9A%A9%EB%90%98%EB%8A%94-%EB%94%B0%EC%98%B4%ED%91%9C

javascript-translate-bot · 2020-09-10T11:44:46Z

Please make the requested changes. After it, add a comment "/done".
Then I'll ask for a new review 👻

benz-e-class · 2020-09-11T07:50:19Z

@Violet-Bora-Lee 수정 완료. 리뷰 부탁드립니다.

benz-e-class · 2020-09-12T01:50:18Z

/done

javascript-translate-bot added the review needed label Sep 2, 2020

Violet-Bora-Lee requested changes Sep 3, 2020

View changes

javascript-translate-bot removed the review needed label Sep 3, 2020

javascript-translate-bot added the changes requested label Sep 3, 2020

수정 완료

Loading status checks…

0908da4

benz-e-class force-pushed the benz-e-class:benz-e-class branch 2 times, most recently from ce1ee71 to 0908da4 Sep 9, 2020

Violet-Bora-Lee requested changes Sep 10, 2020

View changes

2차 수정 완료

Loading status checks…

4aa734e

javascript-translate-bot added review needed and removed changes requested labels Sep 12, 2020

Dec	JAN	Feb
	06
2020	2021	2022

javascript-tutorial / ko.javascript.info

[윈도우 크기와 스크롤] 번역 완료 #830

[윈도우 크기와 스크롤] 번역 완료 #830

benz-e-class commented Sep 2, 2020

benz-e-class commented Sep 2, 2020

Violet-Bora-Lee left a comment

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

javascript-translate-bot commented Sep 3, 2020

benz-e-class commented Sep 7, 2020

Violet-Bora-Lee commented Sep 9, 2020

benz-e-class commented Sep 9, 2020

Violet-Bora-Lee left a comment

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

javascript-translate-bot commented Sep 10, 2020

benz-e-class commented Sep 11, 2020

benz-e-class commented Sep 12, 2020

		@@ -1,50 +1,50 @@
		# Window sizes and scrolling
		# 윈도우의 크기와 스크롤

	# 윈도우의 크기와 스크롤
	# 윈도우 크기와 스크롤


		How do we find the width and height of the browser window? How do we get the full width and height of the document, including the scrolled out part? How do we scroll the page using JavaScript?
		우리는 어떻게 브라우저 윈도우의 너비와 높이를 찾을 수 있을까요? 우리는 스크롤 된 부분을 포함한 문서의 전체 너비와 높이를 어떻게 얻을 수 있을까요? 우리는 자바스크립트를 이용하여 어떻게 페이지 스크롤을 할 수 있을까요?


		For most such requests, we can use the root document element `document.documentElement`, that corresponds to the `<html>` tag. But there are additional methods and peculiarities important enough to consider.
		대부분의 경우, 우리는 대부분 `<html>` 태그에 해당하는 문서의 루트 요소인 `document.documentElement`를 사용할 수 있습니다. 그러나, 부가적인 방법과 중요하게 고려해야 할 특성도 있습니다.

	대부분의 경우, 우리는 대부분 `<html>` 태그에 해당하는 문서의 루트 요소인 `document.documentElement`를 사용할 수 있습니다. 그러나, 부가적인 방법과 중요하게 고려해야 할 특성도 있습니다.
	대부분의 경우 `document.documentElement`를 사용하면 `<html>` 태그에 해당하는 문서의 루트 요소에 접근할 수 있습니다. 그런데 `document.documentElement`를 사용하는것 말고도 루트 요소에 접근할 수 있는 방법이 여러가지가 있습니다. 그리고 이때 고려해야 할 특성도 있습니다.


		To get window width and height we can use `clientWidth/clientHeight` of `document.documentElement`:
		우리는 윈도우의 너비와 높이를 구하기 위해서 `document.documentElement`의 `clientWidth/clientHeight`를 사용할 수 있습니다.:

	브라우저들은 또한 `window.innerWidth/innerHeight` 속성도 제공합니다. 그것들은 우리가 원한 것처럼 보여집니다. 그러나 왜 그것들을 대신 사용하지 않을까요?
	브라우저는 `clientWidth/clientHeight`말고 `window.innerWidth/innerHeight` 프로퍼티도 제공합니다. `window.innerWidth/innerHeight`만으로도 우리가 원하는 작업을 충분히 할 수 있을 것 같긴 합니다. 그런데 왜 `window.innerWidth`와 `innerHeight`를 사용하지 말라고 했을까요?


		If there exists a scrollbar, and it occupies some space, `clientWidth/clientHeight` provide the width/height without it (subtract it). In other words, they return width/height of the visible part of the document, available for the content.
		만약 스크롤 바가 있고, 스크롤 바가 공간을 어느 정도 차지하는 경우, `clientWidth/clientHeight`는 스크롤 바 공간이 없는 너비/높이를 제공할 것입니다. (스크롤 바 공간을 제외합니다) 다시 말하면, 그것들은 문서에서 보이는 부분의 너비/높이를 반환하고, 콘텐츠를 위해 사용할 수 있습니다.


		If there's a scrollbar, and it occupies some space, then these two lines show different values:
		스크롤 바가 있고, 스크롤 바가 공간을 어느 정도 차지한다면, 아래 두 줄은 다른 값을 보여줍니다:


		For most such requests, we can use the root document element `document.documentElement`, that corresponds to the `<html>` tag. But there are additional methods and peculiarities important enough to consider.
		대부분, `document.documentElement`를 사용하면 `<html>` 태그에 해당하는 문서의 루트 요소에 접근할 수 있습니다. 그리고 이 때, 중요하게 고려해야 할 특성도 있습니다.


		To get window width and height we can use `clientWidth/clientHeight` of `document.documentElement`:
		윈도우 너비와 높이를 구하기 위해서 `document.documentElement`의 `clientWidth/clientHeight`를 사용할 수 있습니다.


		If there exists a scrollbar, and it occupies some space, `clientWidth/clientHeight` provide the width/height without it (subtract it). In other words, they return width/height of the visible part of the document, available for the content.
		스크롤 바가 있고 스크롤 바가 공간을 어느 정도 차지하는 경우 `clientWidth/clientHeight`는 스크롤 바 공간이 없는 너비/높이를 제공할 것입니다. (스크롤 바 공간을 제외합니다) 다시 말하면, `clientWidth/clientHeight`는 문서에서 보이는 부분의 너비·높이를 반환하고, 콘텐츠에 사용할 수 있습니다.


		...And `window.innerWidth/innerHeight` include the scrollbar.
		...그리고 `window.innerWidth/innerHeight`는 스크롤 바를 포함하고 있습니다.


		Theoretically, as the root document element is `document.documentElement`, and it encloses all the content, we could measure document full size as `document.documentElement.scrollWidth/scrollHeight`.
		이론적으로 문서의 루트 요소가 `document.documentElement`이고 `document.documentElement`가 모든 콘텐츠를 둘러싸므로, 문서의 전체 크기를 `document.documentElement.scrollWidth/scrollHeight`를 통해 측정할 수 있습니다.


		But on that element, for the whole page, these properties do not work as intended. In Chrome/Safari/Opera if there's no scroll, then `documentElement.scrollHeight` may be even less than `documentElement.clientHeight`! Sounds like a nonsense, weird, right?
		그러나 페이지 전체로 봤을 때, `document.documentElement.scrollWidth/scrollHeight` 프로퍼티는 의도대로 동작하지 않을 수 있습니다. Chrome/Safari/Opera 브라우저에서는 스크롤이 없는 경우 `documentElement.scrollHeight`의 값은 `documentElement.clientHeight`값보다 작을 수 있습니다! 말도 안 되는 소리 같네요. 이상하죠?


		To reliably obtain the full document height, we should take the maximum of these properties:
		신뢰할 수 있는 문서의 전체 높이 값을 얻으려면 아래 프로퍼티 중 최댓값을 얻어와야 합니다.

javascript-tutorial / ko.javascript.info

[윈도우 크기와 스크롤] 번역 완료 #830

[윈도우 크기와 스크롤] 번역 완료 #830

Conversation

benz-e-class commented Sep 2, 2020

Pull Request 체크리스트

TODO

benz-e-class commented Sep 2, 2020

Violet-Bora-Lee left a comment

This comment has been minimized.

Violet-Bora-Lee Sep 3, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 3, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 3, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 3, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 3, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 3, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 3, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 3, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 3, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 3, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 3, 2020 Member

javascript-translate-bot commented Sep 3, 2020

benz-e-class commented Sep 7, 2020

Violet-Bora-Lee commented Sep 9, 2020

benz-e-class commented Sep 9, 2020

Violet-Bora-Lee left a comment

This comment has been minimized.

Violet-Bora-Lee Sep 10, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 10, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 10, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 10, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 10, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 10, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 10, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 10, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 10, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 10, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 10, 2020 Member

This comment has been minimized.

Violet-Bora-Lee Sep 10, 2020 Member

javascript-translate-bot commented Sep 10, 2020

benz-e-class commented Sep 11, 2020

benz-e-class commented Sep 12, 2020

Violet-Bora-Lee Sep 3, 2020
Member

Violet-Bora-Lee Sep 3, 2020
Member

Violet-Bora-Lee Sep 3, 2020
Member

Violet-Bora-Lee Sep 3, 2020
Member

Violet-Bora-Lee Sep 3, 2020
Member

Violet-Bora-Lee Sep 3, 2020
Member

Violet-Bora-Lee Sep 3, 2020
Member

Violet-Bora-Lee Sep 3, 2020
Member

Violet-Bora-Lee Sep 3, 2020
Member

Violet-Bora-Lee Sep 3, 2020
Member

Violet-Bora-Lee Sep 3, 2020
Member

Violet-Bora-Lee Sep 10, 2020
Member

Violet-Bora-Lee Sep 10, 2020
Member

Violet-Bora-Lee Sep 10, 2020
Member

Violet-Bora-Lee Sep 10, 2020
Member

Violet-Bora-Lee Sep 10, 2020
Member

Violet-Bora-Lee Sep 10, 2020
Member

Violet-Bora-Lee Sep 10, 2020
Member

Violet-Bora-Lee Sep 10, 2020
Member

Violet-Bora-Lee Sep 10, 2020
Member

Violet-Bora-Lee Sep 10, 2020
Member

Violet-Bora-Lee Sep 10, 2020
Member

Violet-Bora-Lee Sep 10, 2020
Member