Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- css
- Eclipse Bug
- 이클립스 소스 비교 안보일 때
- java
- 자바스크립트
- npm
- animation
- VW
- ref전달하기
- frontend
- React
- SSR
- Sass
- ref
- html
- next.js
- Adobe
- Study
- tomcat
- 정적웹사이트
- error
- 이클립스
- gulp
- CSS3
- Eclipse Compare View
- 1분코딩
- TaskRunner
- Eclipse
- 보일러플레이트
- JavaScript
Archives
- Today
- Total
프론트 개발 블로그
window.visualViewport.width, window.visualViewport.height 본문
window.visualViewport
window의 인터페이스의 visualViewport 읽기 전용 속성은 창의 시각적 뷰포트를 나타내는 visualViewport 객체를 반환한다.
Chrome 61, Edge 79, Safari 48 이상 브라우저에서 호환 가능하다.
* IE 는 No support
// 예시 코드
function viewportResize() {
const vh = window.visualViewport.height;
const document = document.documentElement;
document.style.setProperty('-vh', `${vh}px`);
}
https://developer.mozilla.org/en-US/docs/Web/API/Window/visualViewport
반응형
'Javascript' 카테고리의 다른 글
Javascript 중복 클릭 방지 (0) | 2022.09.27 |
---|---|
scroll 이벤트가 실행되지 않을 때 (0) | 2021.10.26 |
IIFE, 재귀 함수, 중첩 함수, 콜백 함수, 고차 함수, 순수, 비 순수 함수 정리 (0) | 2021.09.29 |
자바스크립트에서 타입을 체크하는 방법 typeof (0) | 2021.09.28 |
void 0; 이 뭐지? (3) | 2021.01.18 |