Позиция календаря в iframe в IE 7

Question

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

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

Answer 1

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

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

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

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

Answer 2

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

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

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

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

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

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

Answer 3

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

Answer 4

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

PARENT.HTML

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

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

родительское окно   ПОЛЕ ПОЛЕ FIELDpickupdate.writeControl(); ПОЛЕ ПОЛЕ ПОЛЕ Сохранить изменения

IFRAME.HTML

IFRAME.XSL ]> TEST XML DOC IFRAME СОДЕРЖАНИЕ