¿La temida barra de desplazamiento horizontal del iframe no se puede eliminar en IE?

StackOverflow https://stackoverflow.com/questions/67354

  •  09-06-2019
  •  | 
  •  

Pregunta

Tengo un iframe.El contenido es más ancho que el ancho que estoy configurando, por lo que el iframe obtiene una barra de desplazamiento horizontal.No puedo aumentar el ancho del iframe, así que solo quiero eliminar la barra de desplazamiento.Intenté configurar la propiedad de desplazamiento en "no", pero eso mata ambas barras de desplazamiento y quiero la vertical.Intenté configurar overflow-x en "oculto" y eso eliminó la barra de desplazamiento horizontal en ff pero no en IE.triste para mi.

¿Fue útil?

Solución 

scrolling="yes"  horizontalscrolling="no" verticalscrolling="yes"

Pon eso en tu etiqueta iFrame.

No es necesario perder el tiempo intentando formatear esto en CSS.

Otros consejos

La barra de desplazamiento no es una propiedad del <iframe>, es una propiedad de la página que contiene.intenta poner overflow-x: hidden sobre el <html> elemento de la página interior.

Podrías intentar poner el iframe dentro de un div y luego usar el div para el desplazamiento.Puede controlar el desplazamiento en el div en IE sin problemas, IE solo tiene problemas con el desplazamiento del iframe.Aquí hay un ejemplo rápido que debería funcionar.

<html>
    <head>
        <title>iframe test</title>

        <style>         
        #aTest { 
            width: 120px;
            height: 50px;
            padding: 0;
            border: inset 1px #000;
            overflow: auto;
        }

        #aTest iframe {
            width: 100px;
            height: 1000px;
            border: none;
        }
        </style>
    </head>
    <body>
        <div id="aTest">
            <iframe src="whatever.html" scrolling="no" frameborder="0"></iframe>
        </div>
    </body>
</html>

<iframe style="overflow:hidden;" src="about:blank"/>

debería funcionar en IE.IE6 tuvo problemas para admitir overflow-x y overflow-y.

Otra cosa a tener en cuenta es que el borde de IE en el iframe sólo se puede eliminar si configura el atributo "frameborder" en camelCase.

<iframe frameBorder="0" style="overflow:hidden;" src="about:blank"/>

Sería bueno si pudieras diseñarlo correctamente con CSS pero no funciona en IE.

Todas estas soluciones no me funcionaron o no fueron satisfactorias.Con el DIV desplazable puedes hacer que la barra de desplazamiento horizontal desaparezca, pero entonces siempre tendrás la vertical.

Entonces, para mi sitio donde puedo estar seguro de controlar la altura fija de todos los iframes, la siguiente solución funciona muy bien.Simplemente oculta la barra de desplazamiento horizontal con un DIV :)

    <!-- This DIV is a special hack to hide the horizontal scrollbar in IE iframes -->
<!--[if IE]>
<div id="ieIframeHorScrollbarHider" style="position:absolute; width: 768px; height: 20px; top: 850px; left: 376px; background-color: black; display: none;">
</div>
<![endif]-->
<script type="text/javascript">
  if (document.getElementById("idOfIframe") != null && document.getElementById("ieIframeHorScrollbarHider") != null)
  {
    document.getElementById("ieIframeHorScrollbarHider").style.display = "block";
  }
</script>

También puedes intentar establecer el ancho del cuerpo de la página que se incluye dentro del iframe en 99%.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top