javascript - Raphael js - 個々の要素の不透明度を保持しながらグループの不透明度をアニメーション化する

Question

個々の要素の不透明度の状態を維持しながら、一連の Raphael オブジェクトの不透明度を 1 つのオブジェクトとしてアニメーション化するにはどうすればよいですか? 個々の要素に影響を与えずにセットでアニメーション化することはできないので、処理するオブジェクトを 1 つ作成するにはどうすればよいでしょうか? jQuery の考え方で答えが得られるかどうかを考えています。

Answer 1

グローバル変数を保持している場合は、これを行うことができます。デモを見てください。

var p = new Raphael(10,10, 500, 500);
var x = 0.5;

var r = p.rect(20, 20, 100, 80, 5).attr({fill: 'red', opacity: x}),
    c = p.circle(200, 200, 80).attr({fill: 'orange'}),
    s = p.set(r, c);

s.click(function() {
    s[0].attr({opacity: x - 0.3});
    s[1].attr({opacity: 0.3});
});