Невозможно установить стиль marginTop с помощью script с помощью IE8, но работает в браузере для взрослых

Я пытаюсь оживить выпадающее меню из script. Для этого мне нужно оживить свойство marginTop элемента и увеличить его от -30px до 0px.

Однако в IE8 анимация просто ничего не делает. Я проследил это до того, что установка marginTop в script кажется неэффективной. В Chrome и Firefox это прекрасно работает.

Вот пример, который будет работать с Chrome/Firefox, но не IE:

http://jsfiddle.net/rm58T/2/

Является ли это ошибкой IE, и если да, существуют ли какие-либо обходные пути для такого поведения? Спасибо!

Update:

Вот некоторые скриншоты об ошибке.

В Chrome моя скрипка выглядит так (вы можете увидеть текст "Название нового меню", так как мы изменили поле с помощью script)

enter image description here

В IE8/Vista это выглядит так. Я могу подтвердить в Инструментах разработчика, что topMargin на самом деле 0px, как ожидалось, однако элементы не были повторно нарисованы:

enter image description here

Другое обновление:

Эта ошибка воспроизводится (по крайней мере для меня) в IE8, запущенной в Windows 7, а также IE8, работающей на Windows 2008 Server. Он НЕ воспроизводит меня в IE7, работающем на WinXP. У меня нет машин IE9 для тестирования.

Еще одно обновление:

Я нашел одну потенциальную проблему. Если я устанавливаю p.newmenu на position: absolute; вместо position: relative;, тогда он работает. Однако в моем случае я размещаю все это в всплывающем меню и нуждаюсь в этом элементе управления, чтобы вытолкнуть нижнюю часть модального диалога, поэтому абсолютно позиционирование это не вариант. Однако, возможно, это знание может помочь в поиске работоспособного решения. Пример этой работы можно найти здесь.

Вы верят в другое обновление?

На данный момент я нашел обходное решение. Если я использую top: -30px; вместо отрицательного верхнего поля, тогда все работает. Тем не менее, top ведет себя немного иначе, чем маржа, и делает пользовательский интерфейс не очень приятным. В частности, когда вы используете top: -30px, тогда у вас будет 30px пробелов под вашим элементом, поскольку относительное позиционирование не влияет на другой поток страниц.

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

Ответы

Ответ 1

Триггер для этого поведения - это то, как IE8 обрабатывает элемент набора полей.

Вы можете обойти это, установив отображение для набора полей в встроенный (или встроенный блок).

div.modal.addmenu fieldset {
   display: inline;   
}

Ответ 2

Это не совсем ошибка; он основан только на том, что (чтобы не отставать в сравнении производительности) IE был построен с версии 5.5 с минимальной предустановкой статических определений;

Это означает: вместо того, чтобы тратить любой элемент на все и правильное определение (в зависимости от того, какой бог спецификаций вы получаете за...) для своего типа, IE использует меньше.

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

DOJO: Фактически, вы, как рунический читатель script -javalchemist, должны быть теми, кто должен взять контроль над brew, который обслуживает браузер. Или он делает бум, молча...

GODO: Необходимые действия, если вы хотите использовать отрицательные поля в браузерах, которые не играют на законных основаниях:

  • помните элементы, которые вы хотите использовать для их отображения; не верьте в поставщиков браузеров, что они сделали бы это уже для вас.

    • Если вы просто используете IE 7+, используйте display: inline-block;
    • ЕСЛИ вы хотите получить отрицательные поля для всех известных браузеров, но можете забыть о NS4, затем используйте display: inline; или display: block;

  • Не забудьте создать основу для своих отрицательных полей: установите position: relative;

MOJO: Если IE-Betas и более старые, такие как 5.5 или 6, находятся в вашей точке интереса, вы должны убедиться, что ваш позитив с отрицательным запасом относительного значения имеет значения для width и height; В зависимости от того, чего вы пытаетесь достичь, иногда поддерживается height: auto;.