jQuery事件检测元素位置变化

Question

我想知道是否有一种jQuery事件可以用来确定特定DIV的top属性何时被更改。

例如，我在一个DIV上方放置了不可见内容。当该内容变为可见时，该DIV会向下移动。我想捕获该事件，然后使用offset()函数获取X/Y坐标。

- Steve Horn

---

@Sam Dutton - 不是的。我的解决方案是重新思考页面布局和结构。事情变得太复杂了。 - Steve Horn

Answer 1

简单来说，DOM 中没有检测布局更新的事件。

我认为你有两个选择：

1. 轮询，虽然不太好，但如果你的更新频率要求不高，它可能会起作用。

2. 利用导致不可见 DIV 改变大小的任何事件，并在处理程序中执行所需操作。

---

我应该纠正一下自己。

我查看了DOM，并注意到了DOMAttrModified事件，发现这个JQuery插件，你可能可以利用它来实现你想要的功能。

正如文章所提到的，它在IE和Firefox中运行良好，但在WebKit中似乎存在问题。

- joshperry

---

我认为所链接的插件对OP的情况不起作用。据我理解，只有在属性被脚本更改时DOMAttrModified事件才会触发，而不是像OP所指的那样进行更改后。然而，propertychange事件将会（我认为）在两种情况下触发: http://help.dottoro.com/ljdchxcl.php - Sam Dutton

请注意，Rick的解决方案也使用轮询，这意味着你基本上需要在平滑度和不必要地消耗CPU资源之间进行权衡。 - devios1

Answer 2

我认为你应该能够做到：

$(document).ready( function (){
  $("#mydiv").bind("movestart", function (){ ...remember start position... });
  $("#mydiv").bind("moveend", function (){ ...calculate offsets etc... });
});

- Strelok

---

另一方面，对于相对定位的元素来说，这可能是不可能的。 - Strelok

这些movestart和moveend事件是什么？ https://plugins.jquery.com/event.move/ ? 如果是这种情况，似乎这些事件与触摸和鼠标移动有关，而不一定与任意元素位置的变化有关。 - Abdull

Answer 3

$("#someId").resize(function () {

// your code

});

- Paulo

---

这个不做任何事情。 - Claude Martin