I have a grid of multiple divs and a drag item. I'm trying to get the position of the cell where the drag item is dropped. So how to select the element where the drag elements is dropped on so I can determine the position of this element, and append the drag item to it with a nice animate()?

This is the jquery code I have so far:

2. $(function() {
4. $('.drag').draggable();
5. $('.cell').droppable({
6. drop : function() {
7. var offset = $('.cell').offset();
8. alert( "left: " + offset.left + ", top: " + offset.top );
9. }
10. });
12. });

HTML:

2. <div id="raster">
3. <div class="cell"></div>
4. <div class="cell"></div>
5. <div class="cell"></div>
6. <div class="cell"></div>
7. <div class="cell"></div>
8. <div class="cell"></div>
9. <div class="cell"></div>
10. </div>
11. <div class="drag"></div>

Using this code I only get the position of the first droppable cell :-(

Can someone help me plz?

Thanks!

Christophe