Положение виджета календаря в iframe в IE 7

Question

У меня есть веб-страница, которая включает в себя iframe, а также виджет календаря DHTML. Страница отображается правильно, а также содержимое внутри iframe. Проблема в том, что когда я активирую календарь, который расположен достаточно близко к iframe, некоторые части календаря скрыты iframe.

Я пытался манипулировать позиционированием iframe, используя javascript и CSS (Zindex, z-index), но iframe всегда отображается как самый верхний слой на странице, скрывая любой родительский контент DHTML, который отображается в одном и том же площадь как фрейм. Я также изменил CSS календаря DHTML на значения> 0 и обернул сценарий виджета в div / span с высоким значением z-index, но не повезло.

Answer 1

Я только что понял, что проблема, похоже, связана с MSXML и с тем, как IE преобразует XML-документы. XML имеет ассоциацию таблицы стилей XSLT, которую браузер использует для преобразования XML-документа. Результатом преобразования является HTML-документ. Я не думал, что было бы важно раскрыть, что мой HTTP-ответ был XML, поскольку HTML - это то, что отображается в конце, но это имеет значение Когда источником IFRAME является HTML-документ, все работает нормально. DHTML не распространяется на IFRAME. Но когда MSXML используется для преобразования содержимого IFRAME, возникает проблема. Ниже приведены примеры файлов, иллюстрирующих проблему. Для компонента DHTML я использую виджет spiffycalendar, но я бы предположил, что любой элемент DHTML даст те же результаты.

PARENT.HTML

ПРИМЕР КОНФЛИКТА IFRAME DHTML

                var pickupdate=new ctlSpiffyCalendarBox("pickupdate", "mainF", "PICKUP_DATE","btnDate1","",1);
            </script>

ОКНО РОДИТЕЛЯ Область Область FIELDpickupdate.writeControl (); Область Область Область Сохранить изменения

IFRAME.HTML

IFRAME.XSL ]> ТЕСТ XML DOC СОДЕРЖАНИЕ ПРОГРАММЫ

Answer 2

Вы можете определенно покрыть iFrame с div.

Дело в том, что вы не можете использовать z-index, если не используете позицию: относительную, или позицию: абсолютную, или позицию: фиксированную в каландарном делении.

То, что вы хотите сделать, это изменить CSS-свойство position для calandar, чтобы оно было «относительным». Если ваш iFrame имеет нормальное статическое позиционирование (то есть вы не добавляли в него никакого специального позиционирования, это будет работать).

Если ваш iFrame имеет «абсолютное» позиционирование, вам может потребоваться сделать «position: absolute» на каландаре.

См. Ссылку: http://resopollution.com/test/test.html

(работает во всех современных браузерах, включая IE6)

Answer 3

Google для "IE z-index bug" для множества примеров и решений подобных проблем. Спецификация html утверждает, что z-индекс должен быть абсолютным, но в IE его можно определить для элемента, если родительский элемент позиционирован. В экстремальных обстоятельствах мне пришлось проследить резервное копирование дерева DOM от элемента, вызывающего проблемы, и установить атрибут z-index для любого родительского элемента, имеющего позицию, а не для элемента, который затемняется (и по праву должен иметь свой z Индекс установлен). Панель инструментов IE Developer может помочь для динамической отладки, если это действительно беспорядок, просто начните устанавливать свойства z-index вверх по дереву, пока не найдете тот, который заставляет его выглядеть правильно.

Answer 4

Z-индекс iframe обрабатывается IE a странным способом . Если вы можете избавиться от этого, я бы порекомендовал вам сделать это и просто вставить содержимое в обычный раздел.

Если у вас нет другого выбора, кроме как сделать это, имейте в виду, что z-индекс элементов, подобных и будет бесконечным в IE6. Таким образом, способ суммирования заключается в использовании фреймов с более высокими zindexes, так что это будет бесконечность против бесконечности + 1.

Примером этого является сложение. Оба имеют бесконечный z-индекс, но вы можете сложить их. Оформить заказ Код Stu Nicholls , это может быть полезно.

Это довольно плохая мысль, мое решение было бы избежать появления других полей в этой области.