RaphaelJS中對象的漸變透明度

我試圖讓一個矩形部分透明，其中左側部分是不透明的，而右側部分是更透明的，如果你進入該方向。RaphaelJS中對象的漸變透明度

這適用於Firefox，Chrome，但不適用於Internet Explorer 7或IE8。在IE中，所有矩形都以相同的透明漸變顯示。

function drawTest(y, pct) { 
    var recttest = paper.rect(25,y,100,30); 
    var gradstr = "0.0-#db38cc:5-#db38cc:"+pct; 
    recttest.attr({"fill": gradstr,"opacity": "0.01"}); 
} 
$(document).ready(function() { 
     paper = Raphael(10,100, 400, 400); 
     drawTest(0, 30); 
     drawTest(50, 40); 
     drawTest(100, 50); 
     drawTest(150, 60); 
     drawTest(200, 70); 
     drawTest(250, 80); 
});

查看here for an example上面的代碼正在運行。

那麼我該如何解決這個IE？請注意，我想將矩形放在圖像頂部，因此它必須是透明的（而不是白色）。

來源

2010-06-23 Roalt

這不能修復。這是VML和Raphaël的限制。

但是，您可以減小矩形的寬度以獲得所需的效果。要獲得半透明矩形，您應該應用.attr（{fill：「0-＃000-＃000」，opacity：0}）;然後用矩形的寬度播放。

來源

2010-06-23 07:46:07

啊，謝謝（...我不想聽到的答案）。其實我通過創建矩形來簡化問題，實際上我需要將它應用於不太對稱的形式（儘管我喜歡解決它的想法）。 – Roalt 2010-06-23 18:48:07

RaphaelJS中對象的漸變透明度

回答

相關問題