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 quitar la barra de desplazamiento. Traté de configurar la propiedad de desplazamiento en "no", pero eso mata ambas barras de desplazamiento y quiero la vertical. Intenté configurar overflow-x en "hidden" y eso mató a la barra de desplazamiento horizontal en ff pero no en IE. triste por mi¿La barra de desplazamiento horizontal del iframe temido no se puede eliminar en IE?
Respuesta
scrolling="yes" horizontalscrolling="no" verticalscrolling="yes"
Ponlo en tu etiqueta de iFrame.
No es necesario perder el tiempo en tratar de dar formato a esto en el CSS.
usted podría intentar poner el marco flotante 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 hacer el truco.
<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>
Gracias por esta solución. El único problema es que debe definir una altura fija para el contenido del iframe, que en mi caso variará. Voy a usar esto y tendré que especificar una altura extra grande para el iframe que es un poco hacky. Pero muchas gracias, esto me llevó allí. – mrjrdnthms
La barra de desplazamiento no es una propiedad de la , es una propiedad de la página que contiene. Intente poner overflow-x: hidden
en el elemento <html>
de la página interior.
trabajó con el elemento del cuerpo. ¡Gracias! –
esta solución es mucho mejor para mantener el código iframe ligero y favorece la encapsulación. no debería tener que recordar agregar y recordar la sintaxis. –
Estoy de acuerdo con @DannyG. Hemos pasado la era de los atributos de presentación en nuestro marcado. Las soluciones de CSS puro son preferibles por una serie de razones. – DuxPrime
<iframe style="overflow:hidden;" src="about:blank"/>
debería funcionar en IE. IE6 tenía problemas para soportar overflow-x y overflow-y.
otra cosa a tener en cuenta es que la frontera de IE en el marco flotante sólo se puede eliminar si se establece el atributo "frameborder" en camelCase.
<iframe frameBorder="0" style="overflow:hidden;" src="about:blank"/>
sería bueno si pudiera estilizarlo correctamente con CSS, pero no funciona en IE.
En mi caso quiero quitar la barra de desplazamiento x, pero no se yy creo establecer el desbordamiento oculta eliminará ambos. ¿Tengo eso correcto? – mrjrdnthms
Todas estas soluciones no funcionó para mí o no fueron satisfactorios. Con el DIV desplazable, puede hacer que la barra de desplazamiento horizontal desaparezca, pero siempre tendrá la vertical.
Por lo tanto, para mi sitio en el que puedo estar seguro de controlar la altura fija de todos los marcos flotantes, este 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 puede intentar establecer el ancho del cuerpo de la página que se incluye dentro del marco flotante al 99%.
- 1. Eliminar iframe barra de desplazamiento horizontal
- 2. Eliminar la barra de desplazamiento vertical, mantener la barra de desplazamiento horizontal en el iframe en Chrome
- 3. ¿Oculta la barra de desplazamiento horizontal en un iframe?
- 4. jqGrid barra de desplazamiento horizontal
- 5. C# WinForms TreeView eliminar barra de desplazamiento horizontal
- 6. Cómo hacer iFrame no tienen la barra de desplazamiento
- 7. Internet Explorer crea barra de desplazamiento horizontal para el ancho de barra de desplazamiento vertical
- 8. barra de desplazamiento horizontal para ul
- 9. cómo mostrar una barra de desplazamiento horizontal
- 10. Barra de desplazamiento horizontal innecesaria jqGrid
- 11. C# ListView Desactivar barra de desplazamiento horizontal
- 12. JQGrid ¿Cómo elimino la molesta barra de desplazamiento horizontal cuando autowidth = true? (En IE)
- 13. Cómo deshabilito la barra de desplazamiento horizontal en un Panel
- 14. problema CSS - barra de desplazamiento horizontal se esconde el contenido
- 15. WPF DataGrid barra de desplazamiento horizontal que no muestra
- 16. La barra de desplazamiento horizontal no funciona en la etiqueta de selección
- 17. UIScrollView no desplazamiento horizontal
- 18. css - Visualización de imágenes con la barra de desplazamiento horizontal
- 19. ¿Cómo deshabilitar la barra de desplazamiento horizontal en FlowLayoutPanel?
- 20. Problemas de desplazamiento de ReportViewer en IE
- 21. WPF Barra de desplazamiento horizontal no está visible
- 22. Cómo eliminar el borde del iframe en IE usando javascript
- 23. Ocultar barra de desplazamiento horizontal html pero no vertical
- 24. cómo estilo la barra de desplazamiento de en iframe?
- 25. iFrame 100% de altura provoca la barra de desplazamiento vertical
- 26. Barra horizontal en JScrollPane
- 27. Desplazamiento horizontal de RichTextBox no funciona
- 28. Barra de desplazamiento horizontal y vertical en Android con tablelayout?
- 29. Posición fija - Desplazamiento horizontal
- 30. CSS: use una barra de desplazamiento horizontal solo
zOMG. Si bien los atributos horizontalscrolling y verticalscrolling aparecen totalmente indocumentados en MSDN, esto funcionó para resolver mi problema IE 6. –
Gran solución, exactamente lo que estaba buscando, tyvm. – David
Tener un problema en IE10 (sí, de nuestros clientes aún lo usan) donde mostramos algunos anuncios HTML5 personalizados dentro de iframe. Hacer este truco no funcionó para nosotros ... – lkartono