JQuery - обратный вызов для смещения()/положение()

Question

У меня есть div, содержащий список элементов, которые имеют статическое позиционирование и для каждого элемента я хочу

1. записи его абсолютное позиционирование с помощью offset() метода
2. Измените его позиционирование absolute, переместить его в другое место, а затем переместить его обратно в исходное положение, используя записанные координаты

Сначала я попытался это:

var positions = {}; 
myDiv.children().each(function(){ 
    var child = $(this); 
    var id = child.attr('id'); 
    var offset = child.offset(); 
    positions[id] = [offset.left, offset.top]; 

    child .css('position', 'absolute'); 
    var x = ...; 
    var y = ...; 
    child.css('left', x); 
    child.css('top', y); 
}); 

console.log(positions); 

В этом случае каждая запись объекта «позиции» имеет одинаковую координату (значение для первого элемента). Однако, если я прокомментирую бит, который перемещает элемент, объекты positions имеют правильные координаты для каждого ребенка.

Так что я предполагаю, что это проблема синхронизации, потому что функция css вызывается до того, как функция offset прекратилась.

Так что мне действительно нужно, чтобы убедиться, что блок child.css('left', x); child.css('top', y); выполняется только при выполнении функции «смещение».

Я пытался что-то вроде

$.queue(child, 'foo', function() { 
     var offset = $(this).offset(); 
     positions[id] = [offset.left, offset.top]; 
     jQuery.dequeue(this); 
    }); 
$.dequeue(child, 'foo'); 
child.promise().done(function() { 
     child.css('position', 'absolute'); 
     ... 
    }); 

, но не повезло: когда я вхожу в positions объекты, которые он до сих пор имеет неправильные координаты.

Я совершенно новый для JS и JQuery, поэтому я уверен, как правильно поступать здесь.

Как я могу убедиться, что блок child.css('left', x); child.css('top', y); будет выполнен только после того, как объект «положений» был заполнен с правильными координатами смещения?

EDIT Я просто понял, что в моем случае мне нужно использовать «позиции()», а не «смещение()», но это не меняет проблему, которую я описал

Answer 1

В .each() изменение положения элементов родственных связей может стать причиной получения неправильных координат после первого.

Почему вы не получаете и не сохраняете все позиции перед изменением? Я имею в виду, что вы должны перебирать детей в два раза.

1. итерация детских и магазин положение, он не изменяет CSS,
2. итерацию детских снова и изменить CSS.