screenfull.js 브 라 우 저 간 JavaScript Full screen API 사용

5359 단어 JavaScript웹 개발 록웹 개발 플러그 인구성 요소프레임
screenfull.js 는 브 라 우 저 를 넘 어 JavaScript Fullscreen API 를 사용 하 는 간단 한 포장 기 입 니 다.페이지 나 모든 요 소 를 전체 화면 에 표시 하고 부 드 러 운 브 라 우 저 로 차 이 를 실현 할 수 있 습 니 다.본 고 는 패 키 징 방법 에 대해 간단 한 번역 만 할 수 있 습 니 다.
github 주소:https://github.com/sindresorhus/screenfull.js 。
지지 하 다.
브 라 우 저 지원 현황:https://caniuse.com/#feat=fullscreen 。
문서.
예:
전체 화면 표시 페이지
document.getElementById('button').addEventListener('click', () => {
    if (screenfull.enabled) {
        screenfull.request();
    } else {
        // Ignore or do something else
    }
});

전체 화면 어떤 요소
const el = document.getElementById('target');

document.getElementById('button').addEventListener('click', () => {
    if (screenfull.enabled) {
        screenfull.request(el);
    }
});

전체 화면 에 jQuery 요 소 를 사용 합 니 다.
const target = $('#target')[0]; // Get DOM element from jQuery collection

$('#button').on('click', () => {
    if (screenfull.enabled) {
        screenfull.request(target);
    }
});

그림%1 개의 캡 션 을 편 집 했 습 니 다.
$('img').on('click', event => {
    if (screenfull.enabled) {
        screenfull.toggle(event.target);
    }
});

전체 화면 변화 감지
if (screenfull.enabled) {
    screenfull.on('change', () => {
        console.log('Am I fullscreen?', screenfull.isFullscreen ? 'Yes' : 'No');
    });
}

디텍터 삭제:
screenfull.off('change', callback);

전체 화면 오류 검출
if (screenfull.enabled) {
    screenfull.on('error', event => {
        console.error('Failed to enable fullscreen', event);
    });
}

방법.
.request()
원 소 를 전체 화면 에 표시 합 니 다.
DOM 요 소 를 받 아들 입 니 다.기본 값。 ， ， 。

，
C++int 형식 변환 string 형식
NLP 실천 2-언어 처리 기술

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage