iPad Safari 100% высота вопроса

Question

У меня есть модальный div на моей странице, который выделяет фон. Если я установил высоту оверлея div на 100%, он отлично работает в IE (на рабочем столе), но в iPad Safari полная высота не отображается серым цветом. В чем именно проблема? Это связано с фиксированной позицией / окном просмотра? Пожалуйста помоги. Ниже CSS для того же самого;

#TB_overlay {
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100;
}
.TB_overlayBG {
    background-color: #000000;
    opacity: 0.4;
}

Answer 1

Привет самый простой способ, и вот как я делаю это, чтобы дать максимальную ширину высоты наложения.Например:

.overlay{
 position: fixed;
 display: none;
 top: 0;
 left: 0;
 z-index: 99;
 width: 10000px;
 height: 10000px;
 opacity: 0.5;
 background: #ccc;
}

Вы можете поместить это внизу, т. Е. Перед тегом body и изменить его display на block всякий раз, когда вы хотите выделить серый фон.Очевидно, что все, что вы хотите показать сверху, должно иметь большее значение z-index.Надеюсь это поможет.Дай мне знать, если не понимаешь.

Answer 2

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

Ссылка: http://css -tricks.com / snippets / css / ipad-specific-css /

Не видя этого, трудно сказать точно, в чем проблема, но попробуйте использовать вышеупомянутый css для применения определенного css к iPad Safari.

Answer 3

Ваши вопросы:

1. Большинство мобильных браузеров игнорируют position:fixed

2. Размеры окон и размеры окна просмотра обрабатываются по-разному, поэтому уловка position:absolute;... также не работает - вам нужно динамически изменить размер div в сценарии, считав размер окна просмотра, или сделать его достаточно большой, чтобы охватить все потенциальные размеры страниц