2

这是一个非常具体的需求。基本上，我想监听大约 20 个 DOM 对象中的任何一个何时更改高度或宽度。更改可能是由窗口大小调整、包含的内容更改或某些作用于 DOM 对象的 javascript 引起的。

IE 为任何 DOM 对象提供 onresize()，而不仅仅是视口，而且这个事件非常高效。事实上，我可以调用一个函数 onresize() 并且该函数会在相关 DOM 对象的大小调整期间不断触发。例如，我可以使用 onresize() 调整另一个 DOM 对象以匹配对象的高度，这两个对象的高度将相互镜像，没有明显的滞后，即使调整大小的对象被动画以增加高度。惊人的。但是，对于除 IE 之外的所有浏览器，onresize() 仅适用于视口调整大小（浏览器/框架）。嘘。

现在我要轮询对象是否正在调整大小，这非常昂贵，并且在我尝试镜像对象时会提供非常明显的延迟。

所以，我的问题是：当调整 DOM 对象的大小时，引发事件的最高效方式是什么？

对不起，很长的问题。另外，我特别不希望使用纯 CSS 来实现这一点。这是实验的一部分。

感谢任何有时间回复的人！

4

2 回答 2

2

将宽度和高度存储在稍后在闭包中引用的变量中。当必要的事件被触发时，检查 clientHeight 和 clientWidth 属性与存储在变量中的属性。

这是我大约 6 个月前制作的 GUI，通过示例解决了该问题：http: //prettydiff.com/jsgui/

于 2012-03-24T23:04:23.567 回答
0

最高效的方法是使用 HTML/CSS 布局，让浏览器自动调整对象大小以匹配。您必须向我们展示您的确切 HTML，以便我们建议在您的情况下如何完成。

正如您所发现的，没有很好的通知让您直接监控单个对象的大小调整。您可以做的最好的事情是监视所有可能导致调整大小的事件，然后自己手动检查每个对象与先前保存的大小或比较两个对象以查看它们是否匹配。这可能不会让您获得无延迟的体验，但它会与您使用 javascript 解决方案一样好。

于 2012-03-24T23:08:07.900 回答