Почему Internet Explorer автоматически настраивает style.left значение div в некоторых случаях?

Question

Я корректирую стиль div с помощью JavaScript:

div.style.left = "486px";

Я вывел значение:

console.log("left after:" + div.style.left);

вывод:

LOG: оставлено после: 486px

выглядит хорошо. Но я вижу, что div там нет. Я проверяю встроенный стиль с помощью инструментов разработчика:

left: 852px

Это не всегда происходит. Некоторые изменения левого значения работают правильно. Но на некоторых некоторые "дополнительные" настройки сделаны после.

Это происходит только в Internet Explorer (протестировано с версией 8). Протестировано в Firefox, Chrome, Opera и Safari, и этого не происходит. Есть идеи?

Я делаю эти настройки как реакцию на масштабирование браузера с помощью функции $ (window) .resize. Я делаю вывод «осталось после:» в конце. Я предполагаю, что браузер завершил все масштабирование и изменение положения. Я устанавливаю свое значение, вывожу его в самом конце, а затем ожидаю увидеть это значение в CSS. Это происходит в большинстве случаев, но иногда (большой зум) я получаю эти разные значения.

Редактировать: происходит только в том случае, если масштаб браузера установлен на 150% или 175%. Например, на 150% я установил левое значение на 567 пикселей. Но в CSS я получаю 851px , когда возвращаюсь к уровню увеличения 125% или меньше, он снова работает. С 200% вперёд это также работает (установите 425px).

Answer 1

Абсолютное позиционирование

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

Содержащий блок

Если значение свойства position является абсолютным, содержащий блок является ближайшим позиционированным предком - другими словами,ближайшего предка, у которого свойство position имеет одно из значений абсолютное, фиксированное или относительное. Содержащий блок образован кромкой заполнения этого предка.

элементы, естественно, имеют позициюstatic, таким образом, не делая его содержащим блок по умолчанию.чтобы доказать это, проверьте это демо .попробуйте добавить position:relative к телу, что должно сделать его содержащим блок.

Answer 2

Элемент, который вы изменяете, должен иметь позицию absolute или relative для позиционирования для работы.

Кроме того, поскольку вы используете jQuery, используйте $(element).css('left', "852") вместо div.style.left.jQuery обрабатывает это (и исключения IE) более элегантно.