Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery event to detect when element position changes

I would like to know if there is a jQuery event that I can use to determine when a particular DIV's top property has changed.

For instance, I have invisible content above a DIV. When that content becomes visible, the DIV is shifted down. I would like to capture that event and then use the offset() function to get the X/Y coordinates.

like image 854
Steve Horn Avatar asked Dec 10 '08 03:12

Steve Horn


2 Answers

The easy answer is that there are no events in the DOM for detecting layout updates.

You have a couple options the way I see it:

  1. Poll, nasty but it may work depending on your update frequency requirements.

  2. Tap into whatever event causes the invisible DIV to change size and do whatever you need to do in that handler


I shall correct myself.

I took a look at the DOM and noticed the DOMAttrModified event and found this JQuery Plug-In that you might be able to leverage to do what you want.

As the article mentions, it works great in IE and Firefox but seems to have problems in WebKit.

like image 188
joshperry Avatar answered Oct 20 '22 00:10

joshperry


I thiiink you should be able to do:

$(document).ready( function (){   $("#mydiv").bind("movestart", function (){ ...remember start position... });   $("#mydiv").bind("moveend", function (){ ...calculate offsets etc... }); }); 
like image 30
Strelok Avatar answered Oct 20 '22 01:10

Strelok