|
【20100117】 其中 rotate 和 skew 可改變目標(biāo)角度，兩者參數(shù)俱為 deg，rotate 屬性只一個(gè) deg 參數(shù)，skew 有兩個(gè) deg 參數(shù)，分別控制 X 軸與 Y 軸。 那么，問(wèn)題來(lái)了。首先，“傾斜”和“旋轉(zhuǎn)”究竟有何不同？skew 的兩個(gè)參數(shù)允許單獨(dú)控制水平傾斜和垂直傾斜，假設(shè)兩個(gè)參數(shù)值相同，豈非等價(jià)于整體旋轉(zhuǎn)？然則 rotate 屬性豈非多余？ 目前CSS3.0的相關(guān)技術(shù)文章不多，只好親自實(shí)驗(yàn)。實(shí)驗(yàn)過(guò)程繁瑣之極，茲不贅述，只說(shuō)結(jié)果。當(dāng)中頗多趣味。 rotate 的一個(gè) deg 參數(shù)，控制目標(biāo)整體旋轉(zhuǎn)，而與目標(biāo)的內(nèi)部性狀無(wú)關(guān)。換言之，就像前陣子上海倒而未塌的樓，那是因上帝將它的 rotate 參數(shù)設(shè)為了 90deg，而某些無(wú)知者 onclick 將其觸發(fā)了，但樓體的內(nèi)部格局卻未發(fā)生任何形變。so，rotate 屬性的作用就是將目標(biāo)整體左旋或右旋，而不改變目標(biāo)內(nèi)部的任何性狀。 skew 的兩個(gè) deg 參數(shù)互不影響，but，當(dāng)其中之一改變時(shí)，目標(biāo)的形狀亦會(huì)隨之改變，如同四邊形左右傾斜時(shí)，上下兩邊仍保持水平，反之亦然，實(shí)際上是變成了平行四邊形；至于四邊形內(nèi)部的文字，也會(huì)依此規(guī)則形變。當(dāng) skew 的兩個(gè) deg 參數(shù)相等時(shí)，譬如都設(shè)為30deg【注1】，則最終效果等同于 rotate 將目標(biāo)右旋30度，并整體放大若干倍【注2】。 為何會(huì)放大呢，是 skew 所依據(jù)的數(shù)學(xué)公式本身所無(wú)法避免的副作用？抑或其實(shí)是解釋和實(shí)現(xiàn)上的 bug？都無(wú)從知曉。skew 依據(jù)何種數(shù)學(xué)公式不必深究，只是想，無(wú)論何種情形，在內(nèi)部引入一個(gè)參數(shù)用以修正這意外的縮放效應(yīng)，大約是可行的；然而實(shí)現(xiàn)起來(lái)是否比較復(fù)雜呢？否則就難以解釋 rotate 屬性為何存在了?；蛘唠m不復(fù)雜，然單獨(dú)定義一個(gè)整體旋轉(zhuǎn)的屬性 rotate，較之在 skew 內(nèi)部引入修正參數(shù)，假如前者解釋更清晰，實(shí)現(xiàn)更容易，則 skew 之外再有一個(gè) rotate 就理所當(dāng)然了；盡管會(huì)造成使用者的某種輕度惶惑。
【注1】此處所謂一致是指絕對(duì)值，實(shí)際 X軸的 deg 值為負(fù)。因 skew 的 deg 參數(shù)作用于X軸與Y軸時(shí)，似乎并不一致，X軸的 deg 值為正則左傾（相當(dāng)于左旋），為負(fù)則右傾（相當(dāng)于右旋），而 Y軸與 X軸恰好相反，deg 值為正則右傾（相當(dāng)于右旋），為負(fù)則左傾（相當(dāng)于左旋）。至于 rotate，其 deg 值若為正則右旋（順時(shí)針），為負(fù)則左旋（逆時(shí)針）。 【注2】筆者未曾實(shí)際計(jì)算倍數(shù)，僅憑觀察推測(cè)，以一維線段而言，縮放比例似是原長(zhǎng)與其在傾斜後所在斜面上的投影長(zhǎng)之比，譬如水平線段AB長(zhǎng)為1，投影在與其夾角為60°的平面上，則其投影A'B'的長(zhǎng)變?yōu)?，此似即為 skew 的變形規(guī)則，換言之，一維圖形在旋轉(zhuǎn)某個(gè)角度之後，為保持其寬度或高度不變，其本身長(zhǎng)度就增加了，此規(guī)則應(yīng)用到二維圖形，其整體面積勢(shì)必增加，放大為原圖形的相似形。 |
|
|
