Как изменить многослойные свойства CSS с помощью Mootools Fx?

Question

Существуют некоторые свойства CSS, которые можно (насколько я знаю) изменить только в виде набора значений, например text-shadow (text-shadow:<xOffset> <yOffset> <radius> <color>;).Я видел некоторые, называемые сокращенными значениями, хотя я никогда не видел более длинную синтаксическую версию.

Итак, в двух словах, я хотел бы изменить отдельные части объявления, как в примере коданиже в переходе Fx.Morph, не прибегая к хаки, зависящие от перехода:

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

Допустим, мне нужно затенить тень.Как мне это сделать?

Answer 1

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"));
    }
});