jQuery是一種著名的JavaScript庫,具有添加交互性和動態效果的能力。通過使用jQuery,我們可以使用JavaScript在頁面上創建全屏和退出全屏的功能。以下是實現全屏和退出全屏的代碼示例:
// 進入全屏 function launchIntoFullscreen(element) { if(element.requestFullscreen) { element.requestFullscreen(); } else if(element.webkitrequestFullscreen) { element.webkitrequestFullscreen(); } else if(element.mozrequestFullscreen) { element.mozrequestFullscreen(); } else if(element.msrequestFullscreen) { element.msrequestFullscreen(); } } // 退出全屏 function exitFullscreen() { if(document.exitFullscreen) { document.exitFullscreen(); } else if(document.webkitExitFullscreen) { document.webkitExitFullscreen(); } else if(document.mozCancelFullScreen) { document.mozCancelFullScreen(); } else if(document.msExitFullscreen) { document.msExitFullscreen(); } } // 添加事件監聽器以啟動全屏 $("#fullscreenButton").click(function() { launchIntoFullscreen(document.documentElement); }); // 添加事件監聽器以退出全屏 $("#exitFullscreenButton").click(function() { exitFullscreen(); });
如上所示,您可以將所有可用的瀏覽器API用于全屏請求,以優化兼容性,從而啟動和退出全屏。您還可以通過添加事件監聽器在單擊單個按鈕時控制此操作。