When is opacity 0 *not* transparent?
I've got a curious problem (and a fix) where I draw a zero-opacity rectangle (for mouse events), but it's not transparent. It has been transparent in the past, but I've changed something in the code, and it's no longer transparent. This is the rectangle:
shape = svgDocument.createElementNS(svgns, "rect");
shape.setAttributeNS(null, "x", x);
shape.setAttributeNS(null, "y", y);
shape.setAttributeNS(null, "width", w);
shape.setAttributeNS(null, "height", h);
shape.setAttributeNS(null, "stroke", "none");
shape.setAttributeNS(null, "stroke_width", 0);
shape.setAttributeNS(null, "fill_opacity", 0);
shape.setAttributeNS(null, "stroke_opacity", 0);
shape.setAttributeNS(null, "stroke_dasharray", 0);
shape.setAttributeNS(null, "fill", "#ffffff");
shape.setAttributeNS(null, "onmouseover", "popup_开发者_StackOverflow社区on(evt)");
shape.setAttributeNS(null, "onmouseout", "popup_off(evt)");
svgDocument.documentElement.appendChild(shape);
I changed something - I'm not sure what - and the box is no longer transparent - it completely obscures the background grid lines. I googled this, and tried changing the fill colour, with no change. Eventually, I found Mozilla MDN examples which used a fill of "transparent". This works in both Chrome and FF (not tried IE9).
"transparent" isn't documented as a value in the SVG 1.1 2nd edn spec. Any ideas what's going on here? Is there something unusual about the rect above?
Shouldn't those SVG attributes contain dashes instead of underscores (i.e. fill-opacity
)?
精彩评论