在 HTML 页面中,可以出于多种原因重新定位元素 - 元素的样式更改(边距、填充、高度等)、其他元素的插入或删除,或其他元素的样式更改。
我需要确保 jQuery 对话框始终位于锚点旁边,因此如果锚点移动,对话框也会移动。但是,我不控制显示对话框的页面(我动态注入了一些 JS)。我认为我可以使用 MutationObserver 观察到元素(及其所有父元素)的 offsetTop 属性的变化,但 offsetTop 的变化似乎不会引发突变事件。
有人可以确认 offsetTop 的变化不会引发突变事件,或者告诉我如何观察偏移顶部吗?
或者,如果有一些其他技术可以确保对话框保持在它的锚点上,我会全神贯注 - 但请注意我不控制页面本身的约束,只有对话框:)
小提琴:
在下面的小提琴中,单击“边距”按钮会修改锚元素的边距顶部,导致style
属性发生变化,从而触发重新定位。但是,单击其他按钮不会导致重新定位,即使 offsetTop 属性已更改。我需要另外两个按钮来position()
调用该函数。
http://jsfiddle.net/ustmssx7/2/
约束
我不控制 HTML 或 Javascript——我的 JS 被注入到别人的页面中,所以我能做的事情非常有限。
倒退
我的后备解决方案是window.anchor.offsetTop
每 100 毫秒左右轮询一次,并在它发生变化时重新定位。但是,投票很糟糕,所以如果我可以对事件做出反应,那就更好了。