Notice
Recent Posts
Recent Comments
Link
투케이2K
335. (javaScript) 자바스크립트 requestFullscreen , exitFullscreen 사용해 브라우저 전체 화면 수행 및 전체 화면 종료 실시 본문
JavaScript
335. (javaScript) 자바스크립트 requestFullscreen , exitFullscreen 사용해 브라우저 전체 화면 수행 및 전체 화면 종료 실시
투케이2K 2023. 10. 18. 20:48[개발 환경 설정]
개발 툴 : Edit++
개발 언어 : JavaScript
[소스 코드]
// --------------------------------------------------------------------------------------------------------------
// [html 최초 로드 및 이벤트 상시 대기 실시]
window.onload = async function() {
console.log("");
console.log("=========================================");
console.log("[window onload] : [start]");
console.log("=========================================");
console.log("");
/**
* ---------------------------------------------------
* [요약 설명]
* ---------------------------------------------------
* 1. document.documentElement.requestFullscreen() : [표준 사양] 브라우저에 포함된 전체 Dom 요소를 지정해 전체 화면으로 표시합니다
* ---------------------------------------------------
* 2. document.exitFullscreen() : [표준 사양] 전체 화면된 것을 종료합니다
* ---------------------------------------------------
* 3. 참고 :
*
* - 해당 전체 화면 수행 및 종료 메소드는 표준이지만, 브라우저 마다 지원되는 것이 다르기 때문에 분기 처리가 필요할 수 있습니다
* - 해당 전체 화면 및 종료 메소드 수행 시 보안상의 이유로 자동으로 호출할 수 없습니다
* (사용자 작업에 의해서 호출 필요 : 버튼 클릭 이벤트 내에서 해당 함수 동작)
* ---------------------------------------------------
**/
// [body 지정]
var body = document.body
// [클릭 이벤트 등록]
body.onclick = function() {
console.log("");
console.log("=========================================");
console.log("[window onload] : [body] : click");
console.log("=========================================");
console.log("");
if (!document.fullscreenElement) { // [전체 화면이 아닌 경우]
document.documentElement.requestFullscreen() // [전체 화면 전환]
} else {
document.exitFullscreen() // [전체 화면 종료]
}
}
};
// --------------------------------------------------------------------------------------------------------------
반응형
'JavaScript' 카테고리의 다른 글
Comments