Re: position:relative 与 transform

下面回文

(11/08/12 14:55), John Hax wrote:
> [恕刪]
> 我也认为Atkins这个设计比CSS原先的设计要好。原本的设计中，太多indirect
> 的因素，无论对于实作还是理解 都是非常头痛。

算我多事，不過我看叫他 Tab 就好，還沒聽過別人叫他 Atkins。

> CSS属性没法实现，因为像position-root-top这样的属性直接被引擎抛弃
> 了，cssom里拿不到！（神奇 的IE系列是唯一的例外）。
>
> 当然可以做JS接口，但是这样丧失了CSS的其他power如selector的自动匹配和
> cascade。

我在試著蒐集一些中文世界的兼容程式碼[1]的時候瀏覽了 Modernizr 專案蒐集的
那些兼容程式碼，發現到 CSS3 Flexbox 的兼容用了一套叫做 Selectivizr 的
CSS3 選擇器兼容的程式庫，雖然有點誇張不過 Selectivizr 內有 CSS 解析與層
疊的部份。Selectivizr 說明上有說它不支援 DHTML 所以這個東西實驗性質還是
相當高，不適合實用。

我覺得做 JS 介面聽起來很沒意思，這個東西有趣的地方在於實用好寫又不難懂，
也完全不用碰 JS，所以這個兼容應該是在背後自動運作的，做這個東西有幾個好處：
* 再次幫助大家了解 'position: relative;'，我想離 position-root 來臨之前
大家還是必須要跟 'position:relative;' 相處很長一段時間。
* 多了解一些使用情節，像是因為我前端經驗不夠還是不太了解 'position-root:
previous;' 到底用在什麼情況下。
* 有趣的演示，雖然不太實際不過這個功能應該還是能引起很多人共鳴。

提到 CSSOM，為什麼 Gecko 跟 WebKit 不像 IE 那樣支持自定 CSS 屬性呢？自定
事件倒是都有了。

[1] https://developer.mozilla.org/zh_tw/HTML5_Cross_Browser_Polyfills

> 不过就这个case来说，通常很少会override像定义position这样的规则，所以可
> 以考虑哦。待我有空尝试一 下。

position 這類的屬性一但動態瀏覽器會出錯的地方根據經驗還蠻不少的，你現在
用最新版 Chrome 用 JS 改一改 writing-mode 就會看到很多奇怪的東西了。瀏覽
器在這個地方應該做了很多優化。

Kenny

Received on Tuesday, 16 August 2011 02:36:47 UTC