意外的發現乙個網頁有乙個按鈕能使網頁全屏，查了下**發現是h5的全屏api，於是就查了下資料，記錄下來供以後開發時參考，相信對其他人也有用。
參考資料：
利用js如何做到讓頁面全屏和不全屏功能
element.requestfullscreen() mdn
h5有乙個全屏api，element.requestfullscreen()方法用於發出非同步請求使元素進入全屏模式。
需要注意的是：只有包含在頂層文件內部的標準html元素、元素和元素，以及擁有allowfullscreen屬性的iframe的內部元素可以進入全屏模式。這意味著在frame內部的元素，以及object的內部元素不能進入全屏模式。
示例**如下：
全屏模式
取消全屏
示例如下：
document.addeventlistener('fullscreenchange', function());
document.addeventlistener('webkitfullscreenchange', function());
document.addeventlistener('mozfullscreenchange', function());
document.addeventlistener('msfullscreenchange', function());
document.addeventlistener('fullscreenerror', function());
document.addeventlistener('webkitfullscreenerror', function());
document.addeventlistener('mozfullscreenerror', function());
:-webkit-full-screen
:-moz-full-screen
:-ms-fullscreen
:fullscreen
H5頁面內容較少時如何讓頁面全屏在手機顯示呢
解決方案1 設定如下 html,body 這樣高度首先不會寫死,而且滿足最小高度是滿屏 解決方案2 可以用vh和vw來布局。100vh和100vw就是你裝置的高度和寬度。先把外面盒子固定下來，所有的盒子的高度加起來等於100vh剛好佔滿一屏這樣就不會有空白。像你這種盒子比較少的可以用js獲取裝置的高...
用rem實現h5頁面的編寫
一 靜態頁面的布局 將這段 加到script中 function doc,win else if doc.addeventlistener return 瀏覽器寬度高度變化的時候 win.addeventlistener resizeevt,recalc,false 瀏覽器開始渲染的時候 doc.a...
H5頁面中喚起native app
2 js如何知道手機已經安裝了對應的應用 比如 這種方式ios和android都可以共用 結合這個思路，我們基本可以得到我們的實現方案 var iframe document.createelement iframe var body document.body iframe.style.displ...