私はフルスクリーンAPIを1つのボタンのクリックに作用させ、別のボタンのクリックでフルスクリーンを終了させます。私はフルスクリーントグルを1つのボタンで開いたり閉じたりしたいと思っています。1つのボタンでフルスクリーンAPIを切り替えます
var requestFullscreen = function(ele) {
if (ele.requestFullscreen) {
ele.requestFullscreen();
} else if (ele.webkitRequestFullscreen) {
ele.webkitRequestFullscreen();
} else if (ele.mozRequestFullScreen) {
ele.mozRequestFullScreen();
} else if (ele.msRequestFullscreen) {
ele.msRequestFullscreen();
} else {
console.log('Fullscreen API is not supported.');
}
};
var exitFullscreen = function() {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
} else {
console.log('Fullscreen API is not supported.');
}
};
var fsDocButton = document.getElementById('fs-doc-button');
var fsExitDocButton = document.getElementById('fs-exit-doc-button');
fsDocButton.addEventListener('click', function(e) {
e.preventDefault();
requestFullscreen(document.documentElement);
});
fsExitDocButton.addEventListener('click', function(e) {
e.preventDefault();
exitFullscreen();
});
<button id="fs-doc-button">FULLSCREEN</button>
<button id="fs-exit-doc-button">EXIT FULLSCREEN</button>
フルスクリーンのオンとオフの状態をブール値で指定できます。 –
Arnaud Guerasが述べたように、ブール値 'var fullscreen_status = false; 'を使用し、イベントリスナ – DaTebe