設置IPhone Safari瀏覽器全屏瀏覽界面

設置IPhone Safari瀏覽器全屏瀏覽網頁界面.

 

第一種方法：添加viewport meta標簽，使界面全屏顯示。

　　<!--iphone設備中的safari私有meta標簽，它表示：允許全屏模式瀏覽-->
　　<meta name="apple-mobile-web-app-capable" content="yes" />

　　但是這種方法個人在i4s上面測試，如果是直接打開safari瀏覽網頁是木有任何效果的... 需要通過將網頁添加到主屏幕中成為一個快捷方式，通過快捷方式進入才會有全屏的效果。

　　有種方法可以判斷用戶是從瀏覽器直接打開站點還是通過快捷方式進入，就是下面這個：

　　　　window.navigator.standalone

　　當從瀏覽器直接進入站點時該值為false，由快捷方式進入時則為true。

　　通過這個也可以做出 當用戶通過瀏覽器打開web應用時可以彈出提示，提醒用戶將網頁添加到主屏將會獲得更好的體驗，由此引導客戶。

 

第二種方法：

　　使用js的window.scrollTop事件，加上計時器實時將頂部url欄去除。

 setInterval(function(){
         window.scrollTo(0,0);
    },500); 

　　使用該方法有個條件就是body的高度必須大於iphone屏幕的高度，否則沒有效果。

 

另外發現一個對於webApp開發的一些技巧運用等寫的挺全的文章，分享一下~

http://blog.csdn.net/spring21st/article/details/6989497

做iphone webAPP的朋友可以去瞄一下~