ware_fz
用文字记录生活
一个关注技术与人文的IT博客
在HTML5中提供了一个全屏API:fullscreen,它不仅只用于video视频全屏,还可以用在其他HTML中一些dom元素上,如:div, img, canvas等,都是可以使其全屏的。
代码示例
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
| 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.'); } };
|
兼容性
本文代表个人观点,内容仅供参考。若有不恰当之处,望不吝赐教!