En este post mostrare la solucion a este problema
con este sencillo codigo javascript nativo y/o jquery redimensionaremos la altura del iframe.
Codigo javascript
<html>
<head>
<script language="JavaScript">
function rezise(obj){
var height=obj.contentWindow.document.body.scrollHeight;
obj.style.height=height;
}
</script>
</head>
<body>
<iframe id="miFrame" src="iframe.html" width="100%" height="0" frameborder="1" transparency="transparency" onload="rezise(this);"></iframe>
</body>
</html>
Codigo jquery
<html>
<head>
<script language="JavaScript">
function rezise(obj){
jQuery.each(jQuery.browser, function(i, val) {
if (val == true) {
brow = i.toString();
}
});
var height=0;
if (brow == 'mozilla') {
height=$(obj).contents().find('body').outerHeight();
}
else if (brow == 'msie') {
height=$(obj).contents().find('body').innerHeight();
}
else {
height=$(obj).contents().find('body').height();
}
$(obj).css('height',height+ 'px');
}
</script>
</head>
<body>
<iframe id="miFrame" src="iframe.html" width="100%" height="0" frameborder="1" transparency="transparency" onload="rezise(this);"></iframe>
</body>
</html>
Como puedes realizar esto, para que se ajuste a la pagina evitando el scroll
ResponderEliminarel script tiene que estar en la pagina principal
EliminarComo puede hacerse sin modificar el codigo html del iframe? O al menos se puede fijar un mismo width y height a todos los iframes con javascript sin modificar html (solo javascript)
ResponderEliminarclaro por ejemplo
Eliminarconst iframes=document.querySelectorAll('iframe')
iframes.forEach(function(iframe){
iframe.style.width='50%';
iframe.style.height='100px';
})