[iPhone]如何隱藏iPhone Safari的工具列

[iPhone]如何隱藏iPhone Safari的工具列
把iPhone Safari瀏覽器討人厭的工具列(Toolbar)隱藏起來,以避免它佔用太多畫面的空間

 

在開發Mobile Web應用程式時,最大的挑戰就是如何在小小的畫面中放入我們可以一目了然的資訊,這時候我們對螢幕的使用就會錙銖必較,因此上頭的Addressbar跟Toolbar真的是非常礙眼,這兩列大概就佔掉我們1/4的畫面高度了。
 image

之前Pou有寫了一篇文章教我們如何把Addressbar隱藏起來:
隱藏iPhone瀏覽器上的Address Bar

今天又發現原來連下方的Toolbar也可以隱藏,真的是酷斃了,怎麼使用呢?下面跟大家分享一下:

Step1:在目標網頁中加入一行Meta設定,以下以點部落為例:
<meta name="apple-mobile-web-app-capable" content="yes" />
image 

Step2:開啟Safari瀏覽器,開啟欲連結的網頁,點選工具列的加入書籤(Add to Bookmark)會出現以下畫面,請點選加入主畫面螢幕(Add to Home Screen),將這個網站加入到桌面上新增一個小icon:
image
(備註:Pou有教我們如何更改桌面的icon圖示:Custom WebSite icon on Home of Mobile)

Step3:這時候在桌面上應該就可以看到剛剛加入的那個icon,開啟它就可以看到Toolbar被隱藏囉。
image

結果畫面:
image

目前這個功能只有iPhone支援囉,Android的話本來就預設隱藏了Toolbar,影響較小,其他瀏覽器我還在找有沒有相關的解決方案,如果有人有解決方案的話,也請提供給我參考參考,感謝。

 

游舒帆 (gipi)

探索原力Co-founder,曾任TutorABC協理與鼎新電腦總監,並曾獲選兩屆微軟最有價值專家 ( MVP ),離開職場後創辦探索原力,致力於協助青少年培養面對未來的能力。認為教育與組織育才其實息息相關,都是在為未來儲備能量,2018年起成立為期一年的專題課程《職涯躍升的關鍵24堂課》,為培養台灣未來的領袖而努力。