如何使用Mootools Fx變形多部分CSS屬性？

有一些CSS屬性只能（據我所知）修改爲一組值，如text-shadow（text-shadow:<xOffset> <yOffset> <radius> <color>;）。我已經看到一些簡稱值，儘管我從來沒有見過較長的語法版本。如何使用Mootools Fx變形多部分CSS屬性？

因此，概括地說，我想在一個Fx.Morph過渡下面的示例代碼來修改聲明的個別部件，如不採取過渡特定黑客：

text-shadow:1px 1px 2px rgba(0,0,0,0.5)

比方說，我需要淡出陰影。我將如何實現這一目標？

來源

2010-10-20 jpeltoniemi

Element.Styles.textShadow = "rgb(@, @, @) @px @px @px";

就用像this.tween('text-shadow', '#000 10px 10px 30px'); - 但你需要首先定義一個基本影子VIA MooTools的。這似乎工作：http://jsfiddle.net/dimitar/6UADQ/10/

Element.Styles.textShadow = "@px @px @px rgb(@, @, @)"; 

document.id("moo").set("tween", { 
    duration: 600, 
    link: "cancel" 
}).setStyle("text-shadow", "5px 5px 5px #000").addEvents({ 
    mouseenter: function() { 
     this.store("shadow", this.getStyle("text-shadow")); 
     this.tween('text-shadow', '10px 10px 30px rgb(0,0,0) '); 
    }, 
    mouseleave: function() { 
     this.tween('text-shadow', this.retrieve("shadow")); 
    } 
});

來源

2010-10-21 00:05:19

哇，工作。謝謝！ – jpeltoniemi 2010-10-21 00:17:14

從核心源碼的快速搜索中，我可以猜測rgba目前還不支持。我對麼？ – jpeltoniemi 2010-10-21 00:24:08

我不能說我已經嘗試過，但它看起來就是這樣 - 我想你暫時可以在不透明度上使用變形。我會在官方郵件列表上詢問這個問題 - 如果這是一個簡單的勝利，它可能會使1.3.1，否則，2.0 – 2010-10-21 00:32:03

如何使用Mootools Fx變形多部分CSS屬性？

回答

相關問題