jquery - number - iFrame y Mobile Safari(iPad/iPhone)

link tel

Question

Aquí está el problema, tengo y NECESITO una página web de iframe. Este iframe debe tener un cierto tamaño, tanto ancho como alto. Esto NO funciona en iOS porque Lovely iOS decidió ignorar el atributo de altura de los fotogramas y mostrará todo de forma forzada (¡imbéciles!).

¿Cómo haces para que actúe como un iframe normal?

Answer 1

Primero utilicé el código siguiente para Iframe, este trabajo para todos los sitios web y aplicaciones móviles de Android, ipad excepto iphone. Mientras está en el botón de iPhone, haga clic en no trabajar y css se molestará.

<iframe class ="holds-the-iframe" src="http://.com"  style="width:100%; height:100%;" seamless="seamless" ></iframe>

Luego usamos height en pixel, que es max donde lo aplicamos desde 2000px y lo reducimos, aún funciona y establecemos width = 100%. Esto es trabajo para todos los dispositivos.

<iframe  src="http://.com" style="width:100%;height:1500px;"></iframe>
   

Answer 2

Encontré una manera de hacer esto SI tienes o tienes acceso para modificar tanto la página enmarcada.

Si controlas la página web que está siendo incorporada, una forma que encontré que funciona bien es rodear todo el contenido (NO EL IFRAME) con un div directamente DENTRO de la página iframed. Entonces, justo después de la etiqueta colocarías tu etiqueta.

Luego, prueba Safari mobile Y si está iframed.

browser_=/iPhone|iPad/i.test(navigator.userAgent);
isInIframe = (window.location != window.parent.location) ? true : false;

Si cumple este criterio, establezca la altura del div que colocó en la página enmarcada a la altura del iframe DEBERÍA ser y establezca el desbordamiento del div en automático. Esto creará la ilusión de que se trata de un iframe.

Ahora, por último, pero no menos importante, ajuste la etiqueta iframe en

<div style="-webkit-overflow-scrolling:touch; overflow: auto;">

Si tiene elementos que usaron jQuery (ventana) o algo así, asegúrese de cambiarlo para usar el DIV, ya que la ventana (iframe) se expande automáticamente y no es muy útil porque el iframe ya se habrá expandido.

Answer 3

Después de luchar duro, finalmente encontré una forma de hacer que iframe scroll en ios.Haga lo siguiente:

Simplemente coloque un iframe en div (elementos divlike que actúa como contenedor) y aplique los estilos de la siguiente manera y esto funciona perfectamente.

.iframe {
    overflow: scroll !important;
    width: 100%;
    height: 100%;
    border: none;
}

.div {
    overflow: hidden;
    width: 100%;
    height: 100%;
    border: none;
    background-color: #FFF;
}

Como estoy trabajando en GWT, para la gente de GWT aquí está la sugerencia. En el caso de GWT simplemente coloque un iframe en ScrollPanel (div) y aplique los estilos como se indica arriba.