Почему моя страница div постоянно растет на ios (только)?

У меня такая странная ситуация, когда страница div моего документа растет и растет вечно. Я видел это в iOS 5.1 и 6 на iPhone. Вы можете сидеть в отладчике веб-сафари сафари и наблюдать за ростом высоты и минимальной высоты вверх и вверх, а фоновое изображение становится все больше и больше. Посмотрите на значение min-height в эффективном div ниже. Это значение будет увеличиваться, пока не оставить или обновить страницу:Почему моя страница div постоянно растет на ios (только)?

<div id="divMain" data-role="page" data-cache="false" data-theme="c" data-url="divMain" tabindex="0" class="ui-page ui-body-c ui-page-active" style="min-height: 4591px; ">

Обратите внимание, что я не настройки, что стиль атрибут, она становится как-то установить JQuery или JQuery Mobile. Я вижу это много, но не понимаю, как и почему это происходит. Вот мой исходный HTML для этого DIV:

<div id="divMain" data-role="page" data-cache="false" data-theme="c">

Я не могу представить весь код это зависит, но я могу предложить две части данных. Во-первых, если я снимите дисплей : блок настройки в отладчик, который исходит от jquery.mobile-1.1.0.min.css, проблема остановки:

.ui-mobile .ui-page-active { 
display: block; /* uncheck to disable this, and the problem stops */ 
overflow: visible; 
}

Во-вторых, (я думаю, что это связано к проблеме, но я не уверен), эта страница завернута в внешний iframe. Если я иду в CSS для страницы, на которой размещена IFRAME, есть такая строка:

iframe { display: block; height: 100%; width: 100%; overflow: auto; border: none; }

Если я комментирую это, проблема уходит (но страница выглядит все неправильно). Насколько я могу судить, нет javascript-кода, уменьшающего размер или размер страницы любого из div.

Наконец, здесь вычисляемый стиль этого элемента, в соответствии с отладчиком:

-webkit-tap-highlight-color: 
rgba(0, 0, 0, 0); 
-webkit-touch-callout: none; 
background-attachment: scroll; 
background-clip: border-box; 
background-color: 
rgb(255, 255, 255); 
background-image: none; 
background-origin: padding-box; 
background-size: auto; 
border-bottom-color: 
rgb(51, 51, 51); 
border-bottom-style: none; 
border-bottom-width: 0px; 
border-left-color: 
rgb(51, 51, 51); 
border-left-style: none; 
border-left-width: 0px; 
border-right-color: 
rgb(51, 51, 51); 
border-right-style: none; 
border-right-width: 0px; 
border-top-color: 
rgb(51, 51, 51); 
border-top-style: none; 
border-top-width: 0px; 
color: 
rgb(51, 51, 51); 
display: none; 
font-family: Helvetica, Arial, sans-serif; 
height: auto; 
left: 0px; 
margin-bottom: 0px; 
margin-left: 0px; 
margin-right: 0px; 
margin-top: 0px; 
min-height: 38819px; 
outline-color: 
rgb(51, 51, 51); 
outline-style: none; 
outline-width: 0px; 
padding-bottom: 0px; 
padding-left: 0px; 
padding-right: 0px; 
padding-top: 0px; 
position: absolute; 
text-align: center; 
text-shadow: 
rgb(255, 255, 255) 0px 1px 0px; 
top: 0px; 
width: auto;

источник

2013-04-29 Brian Colavito

Удалить «data-cache = false» по умолчанию. Какие версии jquery и JQM вы используете? – Omar

JQM 1.1.0. Я удалил data-cache = false, и это не повлияло. –

Проверьте это http://www.cjboco.com/blog.cfm/post/prevent-apple-s-safari-browser-from-caching-an-iframes-source-or-url/ – Omar

Попробуйте положить содержащий DIV вокруг фрейма.

<div class="container"> 
    <iframe src="http://mydomain.com"></iframe> 
</div> 

<style type="text/css"> 
.container{ 
    position: absolute; 
    top: 0px; 
    left: 0px; 
    right: 0px; 
    bottom: 0px; 
} 
</style>

источник

2013-04-30 01:13:15 Aaron

Почему моя страница div постоянно растет на ios (только)?

ответ

Смежные вопросы