집 >
웹 프론트엔드 >
JS 튜토리얼 >
전체 화면_javascript 기술로 페이지 요소를 표시하는 javascript 전체 화면 방법
전체 화면_javascript 기술로 페이지 요소를 표시하는 javascript 전체 화면 방법
WBOY
풀어 주다: 2016-05-16 17:21:15
원래의
1988명이 탐색했습니다.
가장 간단한 방법 중 하나는 전체 화면에 표시하려는 구성 요소의 스타일을 동적으로 변경하는 것입니다. 예를 들어 위치는 절대값이 되고, 높이와 너비는 창 크기로 설정되고, 배경색은 전체 화면으로 변경됩니다. 흰색(페이지의 나머지 요소를 덮기 위해). 이런 방식으로 강조 표시하려는 구성 요소만 웹 페이지에서 볼 수 있으며 이는 시각적으로 전체 화면과 동일합니다. 동시에 JavaScript는 키보드 이벤트를 모니터링하는 데 사용됩니다. 사용자가 ESc 종료 키를 누르면 원래 상태로 돌아갑니다. 코드의 일부는 다음과 같습니다.
function cancelFullScreen(el) { var requestMethod = el.cancelFullScreen||el.webkitCancelFullScreen||el.mozCancelFullScreen||el.exitFullscreen; } else if ( window.ActiveXObject 유형 !== "정의되지 않음") { // 이전 I E. var wscript = new ActiveXObject("WScript.Shell"); if (wscript !== null) { var wscript.SendKeys("{F11}"); ~ 모든 기기는 전체 화면 기능과 호환됩니다. . 아시는 분 계시면 공유해주시면 정말 감사하겠습니다.
업데이트(2013/09/22)
전체 화면으로 전환할 때 맞춤 작업을 하고 싶은 경우가 많습니다. 이벤트는 다음과 같이 바인딩될 수 있습니다: