Browser戰報: FF4 RC 、Chrome 10 Release、IE 9 RTM、iOS 4.3

[Firefox]
Firefox 4 RC現已可經update取得
更新的就只是minor bug fix。
之後FF的版號會轉為4.0 (其實應該是4.0 RC1，所以what's new一頁會404 XD)
[Release Note]

[Chrome 10]
Chrome 10 release了~

• 換了個v8 js engine
• window終於有做sandbox flash，flash終於不會把chrome打掛 (win 7 chrome應該受惠)
• setting(選項)會開在tab
• 加了一些硬體加速
• background webapp (?!)
• experimental webNavigation API
• Security fix/加強

[Release Note]

[IE 9 RTM]
3月14日

而且會是在SXSW大會上公佈~(所以應該不會跳票)

[iOS 4.3]
今天推出，可經iTunes取得....已知是Mobile Safari JS效能暴升，其他的還在等@firt

[OT: 本日最GJ]
theie9countdown
分明是惡搞the ie6 countdown，不過對象是IE 9 XD

[iOS/Mobile Safari] 用media query時很易中的: orientation 的 scaling bug

之前有遇過，總算有解了就寫一下

[症狀]
如果viewport有設width=device-width + initial zoom=1.0  → page scale在轉完orientation後不正確的見鬼事情
而事情會在有media query有orientation時十分明顯
而且是portrait(垂直/直向)轉landscape(水平/橫向)時發生的...

Demo

[圖解]

(1) 原本的橫向...

(2) 轉一下直向

(3) 轉回橫向 - zoom level出錯了，大了很多 ( > 1.0) 囧

那麼先直後橫呢?

會變成 (2) → (3) → (2)

...也就是說從水平轉垂直是沒事的

為什麼只是和scaling有關呢?

沒media query和scaling的原版
只有scaling
只有media query
和Demo比較一下就清楚了...只有scaling就有事，沒scaling沒事 囧

補充
這個bug最見鬼的是－reload scale照出錯 (Mobile Safari把錯的viewport設定記下來+完全無視initial-scale)，要手動scale down回 1.0才正常orz

[原因?]
好像viewport在轉向那一刻鎖成直向(769px x *)+Safari選scale up而非scale down－1024/769=1.3，於是scale出錯...

Viewport是如何出錯的Demo
(照1、2、3的次序再做一次，每次檢查HTML width和Viewport width)

[解法]
1. 不設viewport meta tag: media query的width和height會可能失敗-預設viewport是980x* [Apple文件]
2. 禁止user-scaling: user-scalable=no
3. 設一個scaling上限: maximum-scale=1