Hi,
I've been using PIE a bit now and it seems to be fitting in quite well - there is one issue I have noticed however with events.
It seems that when I create an absolute positioned div element with a border-radius PIE puts in its own element above it in the DOM tree. When I do (for example) a mouse down event on it, I don't get the DIV as the srcElement on the event - it shows up in Dev Tools as a DispHTMLDivElement normally, but when I use PIE I get a DispHTMLGenericElement.
Is there a way we can make it not muck around with what is the expected event behaviour, or short of that have an attribute on the generic element which links to the real element?
Cheers,
Will
-----------------------
Update - Investigation ensues:
I can look at the event.tagName and see that the PIE elements have funny ones:
"shape" which has a parent with tagName = "group1", which has a parent of tagName = "background", which has a parent of tagName = "css3-container", which is the top most PIE element. I can then get the nextSibling of this and I will have the correct element I want.
Fugly!
-----------------------------
Update #2
There also seems to be an issue with putting events on PIE-ed divs - This could be in relation to my previous post which said that the behaviour wasn't going on right away so I had to readd the behaviour in a timeout - it seems that the eventhandler itself is not being triggered on mouseovers, because PIE's one is taking precedence.
What I have done is try to find the PIE element and attach it to that instead in a timeout:
Code:
normalDiv.attachEvent('on' + type, eventHandler);
setTimeout(function () {
var prevEl = normalDiv.previousSibling;
if (prevEl && (prevEl.tagName === "css3-container")) {
prevEl.attachEvent('on' + type, eventHandler);
}
}, 1000);