Currently Firebug outlines the getBoundingClientRect() values. This is a CSS function that gives the CSS box, I believe it corresponds to "layout area"?
getBoundingClientRect gives the bounding rectangle of the region one gets by taking the union of the CSS boxes generated by the element (more or less; it only looks at the "toplevel" boxes generated by the element).
In the case of blocks, and if you ignore column layouts and printing, there is only one generated box for the element, and in that case that box's rect and the return value of getBoundingClientRect() coincide.
I have no idea what "layout area" is.
But sometimes you are interested in a different box. For example, if you wrap an <a> tag around a large image, you may want to know what part of the screen responds to the link. I guess this is called the "event targeting" area.?
This isn't a box, in general. It's just some region; quite possibly non-rectangular and not really describably as a finite union of rectangles where SVG is involved.... If you ignore svg, though:
For a given element, is the event targeting area according to ROC: collect up all the getClientRects of the element and all its descendants, include text node descendants. Text nodes don't support getClientRects, but you can create a Range covering the text node and call getClientRects on that.
That's correct.
Boris said "union of all client rects", so I guess that is what "collect up" means?
Yes.
The last bit that confuses me is the getClientRect() vs calls to getClientRect() on an element an all of its children. getClientRect() already returns a list. I guess the list part of getClientRect() is really zero, one or two items, just to deal with tables in a special way?
No. You get multiple rects any time line-breaking, column-breaking, or page-breaking happen. But these rects are just the rects for the element itself, and its descendants can overflow it for various reasons (your <img>-in-<a> example is one such reason, but the descendants might also just be positioned or floated).
-Boris _______________________________________________ dev-tech-layout mailing list [email protected] https://lists.mozilla.org/listinfo/dev-tech-layout
