Javascript Raphael设置透明png不透明度丢失alpha通道

我用的是拉斐尔2.1.0

当我在IE8下设置透明PNG的不透明度动画时，透明度动画效果很好。即：从“不透明度0.0”到“不透明度1.0”

不透明度动画结束后，我希望将图像的位置/不透明度设置/恢复为动画前的状态，但图像的alpha通道将变为不透明。从前透明的背景现在变成了白色的正方形

有了SVG渲染器——Chrome和Firefox——一切都很好。我试着把图像、翻译和alpha链接起来，但都没有用

代码如下：

var element = this._paper.image(image.Url(), 0, 0, width, height);
var removeOnStop = true;
var fromParams = {}
var toParams = {};

// From options
fromParams.opacity = options.from.alpha;
// ...
element.attr(fromParams);

// To options
toParams.transform = 'T300,300';
toParams.opacity = options.to.alpha;      

// Animate
var anim = Raphael.animation(toParams, duration, 'linear', function() {  
    if (removeOnStop) {
        element.attr({ opacity: defaultProperties.alpha });
        element.transform('T' + defaultProperties.left + ',' + defaultProperties.top);
    }
}).repeat(repeat);

element.animate(anim);

任何帮助都将不胜感激。

我尝试了以下方法

• 在任何地方都设置alpha动画，但这会导致Raphael中出现空引用问题
• 链接

  translate（）

  /

  transform（）

  和

  attr（）

• 将过滤器直接应用于对象
• 更改顺序（转换前attr，反之亦然）

最后，工作解决方案是使用

attr

转换和设置不透明度：

if (removeOnStop) {
    element.attr({ opacity: defaultProperties.alpha });
    element.transform('T' + defaultProperties.left + ',' + defaultProperties.top);
}

变成

if (removeOnStop) {                        
    element.attr({ transform: 'T' + defaultProperties.left + ',' + defaultProperties.top, 
                     opacity: defaultProperties.alpha });
}

重要的是，在最初创建图像和设置初始不透明度时必须执行此操作

---

我希望这能避免人们将来的麻烦。

谢谢，我今天就需要它：）这适用于

.image

元素。我希望它也能用于路径或其他元素上的图像填充，但似乎不行——任何变换似乎都会永久性地破坏这些元素的PNG透明度。