這篇文章只關注IE。 以下代碼的最後一行導致該問題。GWT:Internet Explorer透明度問題
int width = 200;
int height = 200;
int overHeight = 40;
AbsolutePanel absPanel = new AbsolutePanel();
absPanel.setSize(width + "px", height + "px");
SimplePanel underPanel = new SimplePanel();
underPanel.setWidth(width + "px");
underPanel.setHeight(height + "px");
underPanel.getElement().getStyle().setBackgroundColor("red");
SimplePanel overPanel = new SimplePanel();
overPanel.setWidth(width + "px");
overPanel.setHeight(overHeight + "px");
overPanel.getElement().getStyle().setBackgroundColor("black");
//Setting the IE opacity to 20% on the black element in order to obtain the see through effect.
overPanel.getElement().getStyle().setProperty("filter", "alpha(opacity=20)");
absPanel.add(underPanel, 0, 0);
absPanel.add(overPanel, 0, 0);
RootPanel.get("test").add(absPanel);
//The next line causes the problem.
absPanel.getElement().getStyle().setProperty("filter", "alpha(opacity=100)");
因此,基本上該代碼應該由200像素顯示的200像素紅色正方形(參見underPanel在代碼)和在它的上面通過40像素的200像素黑色矩形(參見overPanel在代碼)。然而,由於黑色矩形的透明度設置爲20%,因此它會部分透明,因此它應該以紅色顯示,但是由於它實際上是褪色的黑色項目,所以會比坐在矩形中的紅色更暗。
由於最後一行代碼將包含AbsolutePanel的不透明度設置爲100%(理論上不應影響視覺效果),因此會出現一些渲染問題。事實上,在這種情況下,躺在上面的面板仍然可以看透,但直通頁面的背景顏色!這就好像坐下的面板根本就沒有...
任何想法?
這是在GWT 2.0和IE7下。
翻譯是,它的工作,感謝您的提示和鏈接。 – 2011-04-02 19:08:22