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

Question

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

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

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

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

Это ошибка IE, и если да, есть ли обходные пути для этого поведения? Спасибо!

Обновление:

Вот несколько скриншотов с ошибкой.

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

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

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

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

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

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

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

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

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

Answer 1

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

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

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

Answer 2

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

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

---

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

---

DOJO: На самом деле, вы как сценарист-читатель, читающий руны, должны быть те, кто должен принятьконтроль над варевом служит браузером.Или это делает бум молча ...

---

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

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

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

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

---

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