這篇文章主要介紹了js之切換全屏和退出全屏實現代碼實例,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
應用場景:
比如很多網頁游戲全屏之類的，或者是網上看小說等。
核心代碼:
//控制全屏
function enterfullscreen() { //進入全屏
$("#fullscreen").html("退出全屏");
var docElm = document.documentElement;
//W3C
if(docElm.requestFullscreen) {
docElm.requestFullscreen();
}
//FireFox
else if(docElm.mozRequestFullScreen) {
docElm.mozRequestFullScreen();
}
//Chrome等
else if(docElm.webkitRequestFullScreen) {
docElm.webkitRequestFullScreen();
}
//IE11
else if(elem.msRequestFullscreen) {
elem.msRequestFullscreen();
}
}
function exitfullscreen() { //退出全屏
$("#fullscreen").html("切換全屏");
if(document.exitFullscreen) {
document.exitFullscreen();
} else if(document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if(document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
} else if(document.msExitFullscreen) {
document.msExitFullscreen();
}
}
var a = 0;
$('#fullscreen').on('click', function() {
a++;
a % 2 == 1 ? enterfullscreen() : exitfullscreen();
})
前端代碼:
<a type="button" id="fullscreen" class="btn btn-default visible-lg visible-md"><i class="fa fa-refresh" aria-hidden="true"></i> 切換全屏</a>
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持億速云。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
