冰楓論壇

 找回密碼
 立即註冊
查看: 4554|回覆: 0

[分享] [Chrome] 修改 Device metrics 變成各種大小的畫面,讓你模擬 Android、iPhone 等螢幕尺寸!

[複製鏈接]

468

主題

0

好友

522

積分

高級會員

Rank: 4

UID
70473
帖子
471
主題
468
精華
0
積分
522
楓幣
738
威望
521
存款
0
贊助金額
0
推廣
0
GP
43
閱讀權限
50
性別
保密
在線時間
28 小時
註冊時間
2014-7-14
最後登入
2015-5-16
發表於 2014-7-14 09:33:57 |顯示全部樓層
在「開發人員工具」右下角有個小齒輪 2013-04-25_200044
點一下可以跳出設定視窗然後點選「Overrides」



「Device metrics」打勾之後,透過選擇上面的「User Agent」就可以輕鬆調整想模擬的手機螢幕尺寸囉!

很適合在設計 RWD 時使用,像我之前再用 Bootstrap 的時候就常常這樣調整呢。
不過你可能會覺得怎麼比手機實際大小差那麼多,如果要跟實際大小一樣只要打勾「Fit in window]就可以了,不過你在手機上看到的應該是沒有勾的樣子

如果想要在網頁中測試觸控的話只要把右邊的「Emulate touch events」打勾就可以囉,你的鼠標應該會變成一個小灰點,然後就可以測試滑動功能了

底下網頁可以測試滑動功能:(其實本來想內遷,可是貌似js被吃掉了...)
http://www.netcu.de/jquery-touchwipe-iphone-ipad-library

不過一切測試最好還是乖乖掏出手機來測試最準了 XD

[size=100%]來源: knowlet3389.blogspot.tw

您需要登入後才可以回帖 登入 | 立即註冊

正在連接伺服器...
打開冰楓聊天室
廣告刊登意見回饋關於我們職位招聘

Copyright © 2011-2019 冰楓論壇, All rights reserved

免責聲明:本網站是以即時上載留言的方式運作,本站對所有留言的真實性、完整性及立場等,不負任何法律責任。

而一切留言之言論只代表留言者個人意見,並非本網站之立場,用戶不應信賴內容,並應自行判斷內容之真實性。

小黑屋|意見反饋|手機版|Archiver|冰楓論壇

GMT+8, 2019-5-27 19:19

APP Store下載 Play Store下載
回頂部