iframe-resizer
iframe-resizer copied to clipboard
lowerElement is good but lowerVisibleElement is much better.
Hi, I would like to highlight that the lower element could be enhanced with the lower visible element option so if I have eg. a scrollable list with hundreds of elements, but the UL only 300px the resize will measure the last LI instead of the UL.
In my case the taggedElement would be a big overhead as I show and hide content and would be much complicated instead of checking the last visible element lowest position.
Would welcome a PR. Someone else tried this once and ran into problems making it work.
You can tag more than one element on a page and it will then pick the lowest of the tagged elements of that is any help.
For the pseudo-code:
var walker = document.createTreeWalker(body, ...),
bottom = body.height + padding;
while(node) {
var node = walker.next();
if (node.style.display != "none") {
bottom = Math.max(bottom, node.getBoundingClientRect().bottom);
if (node != body && node.style.overflow == "hidden") {
node = walker.nextSibling();
} else {
node = walker.next();
}
}
}
It probably wants splitting up into a filter for the overflow and normal .next for the loop to take a little overhead off it. Also (obviously I hope), window.getComputedStyle (cache it, and case insensitive).
Not got enough spare time to do proper code and a PR myself here, but hopefully it's helpful (and there'll be more feedback) - and if nobody else has done one when I do get time then I'll happily PR :-)
Logic for ignoring the overflow on the body is simply because a lot of pages hide the overflow on it to prevent scrolling, but actually want to grow to fit so there's no need for scrolling.
Added :not(option):not(optgroup) to querySelectorAll('body *') in v5.0.0