JS實現全屏和退出全屏


直接上代碼:

//innerHTML指的是從對象的起始位置到終止位置的全部內容,包括Html標簽。
//innerText 指的是從起始位置到終止位置的內容,但它去除Html標簽。

<script type="text/javascript">

function FullScreen(el){
var isFullscreen=document.fullScreen||document.mozFullScreen||document.webkitIsFullScreen;
if(!isFullscreen){//進入全屏,多重短路表達式
(el.requestFullscreen&&el.requestFullscreen())||
(el.mozRequestFullScreen&&el.mozRequestFullScreen())||
(el.webkitRequestFullscreen&&el.webkitRequestFullscreen())||(el.msRequestFullscreen&&el.msRequestFullscreen());

}else{ //退出全屏,三目運算符
document.exitFullscreen?document.exitFullscreen():
document.mozCancelFullScreen?document.mozCancelFullScreen():
document.webkitExitFullscreen?document.webkitExitFullscreen():'';
}
}
function toggleFullScreen(e){
var el=e.srcElement||e.target;//target兼容Firefox
el.innerHTML=='點我全屏'?el.innerHTML='退出全屏':el.innerHTML='點我全屏';
FullScreen(el);
}
</script>
<button onclick="toggleFullScreen(event)">點我全屏</button>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM