Проблемы с порядком выполнения Javascript в Dojo

Question

Прежде чем задать свой вопрос, вот код ошибки:

var coords = dojo.coords(g);
g.style.left = coords.x + "px";
g.style.top = coords.y + "px";
g.style.position = "absolute";

Теперь представьте, что g - это относительно позиционированный элемент с позицией x, равной 70, и позицией y, равной 30. Если я закомментирую последнюю строку кода выше, это то, что dojo.coords(g) дает мне , Но как только я добавлю последнюю строку, dojo.coords(g) вернет позицию x, равную 18, и это именно то место, где был бы элемент, если бы он был абсолютно позиционирован. Мне кажется, что на вызов dojo.coords() не должен влиять код под ним, но это так.

Я также вижу ту же проблему с dojo.require(), когда, если я вызываю ее непосредственно перед вызовом функции, которую она загружает, я получаю неопределенную ошибку для этой данной функции.

Я тестирую в Firefox 3, но я также замечаю похожие проблемы в Safari 3. Есть идеи?

Answer 1

Это не причуды додзё, а то, как работают браузеры. По сути, DOM может потребоваться некоторое время, чтобы отразить ваши изменения и изменить положение элементов или даже изменить макет. Вот почему вы видите то, что видите.

Другая причина может быть в родителе вашего элемента. dojo.coords () возвращает позицию относительно области просмотра. Если вы передадите «true» в качестве второго значения, оно вернет позицию относительно корня документа. Непосредственное присвоение верхнего / левого и изменение положения на «абсолютное» делает элемент позиционированным относительно его родителя, если он был расположен слишком (абсолютный, относительный или фиксированный), или относительно корня документа. Это тонкая разница, но иногда она кусает людей. Соответствующие ссылки: Содержащий блок , MSDN: Атрибут позиции , Тип документа Google: позиция .

PS: лично я полагаюсь на Dojo, чтобы установить left / top, надеясь, что он будет работать правильно, обходя причуды браузера, и я сначала установил позицию:

var coords = dojo.coords(g);
g.style.position = "absolute";
dojo.marginBox(g, {l: coords.x, t: coords.y});

Answer 2

Я все еще хотел бы, чтобы кто-то объяснил, почему это работает, но вот решение:

var coords = dojo.coords(g);
g.style.left = coords.x + "px";
g.style.top = coords.y + "px";
setTimeout(function(h) {
    h.style.position = "absolute";
}, 0, g);

Приветствия

Answer 3

извините, что не отвечаю на ваш вопрос (потому что я не знаю dojo), но, еслиordins.x и corres.y не возвращает строку, в вашей функции есть ошибка,

g.style.left =ordins.x + "px";

g.style.top =ordins.y + "px";

Вам нужно всегда передавать строку в стиле, поэтому добавьте также:

g.style.left = parseInt(coords.x) + "px";
g.style.top = parseInt(coords.y) + "px";

Вы будете удивлены, сколько раз из-за такой ошибки у меня кружилась голова. Насчет ответа, извините, но я не могу вам помочь.

Удачи!

Отредактировано:

О, если бы я понял, я могу вам сейчас помочь .. ну, поскольку я не знаю додзё, я могу указать вам на подобный javascript, который будет делать то, что вы хотите.

g.offsetTop

и

g.offsetLeft 

Даст вам координаты с позиции элемента. Попробуйте их и посмотрите, работает ли это ..