Maak 'n iframe neem vertikale ruimte

Question

Ek wil graag 'n iframe neem soveel vertikale ruimte as wat dit nodig het om die inhoud te vertoon en 'n rolstaaf nie vertoon. Is dit enigsins moontlik?

Is daar enige regstellings?

Answer 1

Dit moet die IFRAME hoogte te stel om hoogte se sy inhoud:

<script type="text/javascript">
the_height = document.getElementById('the_iframe').contentWindow.document.body.scrollHeight;
document.getElementById('the_iframe').height = the_height;
</script>

Jy mag wil scrolling="no" voeg tot jou IFRAME die rolstawe af te skakel.

wysig. Oeps, het vergeet om the_height verklaar

Answer 2

Die oplossing is nie om <iframe> en vir wysig kode gebruik op bediener-kant.

Answer 3

Kyk ook uit hierdie draad: Hoe werk die DiggBar dinamiese grootte hoogte se sy iframe gebaseer op die inhoud nie op hul domein? .

Dit spreek dieselfde vraag.

Answer 4

Dit CSS brokkie moet die vertikale rolstaaf verwyder:

body {
  overflow-x: hidden;
  overflow-y: hidden;
} 

Ek is nie seker nog oor wat dit neem so veel vertikale ruimte as wat dit nodig het, maar ek sal kyk of ek dit nie kan uitvind.

Answer 5

Voeg 'n DOCTYPE verklaring aan die IFRAME brondokument sal help om die korrekte waarde te bereken van die lyn

document.getElementById('the_iframe').contentWindow.document.body.scrollHeight

W3C DOCTYPE vir voorbeelde

Ek was probleme met beide van Internet Explorer en VF as dit die iframe dokument in mode "eienaardighede" is die lewering, totdat ek die DOCTYPE bygevoeg.

VF / IE / Chrome ondersteuning: Die .scrollHeight nie die geval werk met Chrome so het ek vorendag te kom met 'n javascript voorbeeld gebruik van jQuery al IFRAME hoogtes gestel op 'n bladsy wat gebaseer is op die iframes inhoud. NOTA:. Dit is vir verwysing bladsye binne die huidige domein

<script type="text/javascript">
    $(document).ready(function(){
        $('iframe').each(function(){
            var context = $(this);
            context.load(function(event){ // attach the onload event to the iframe  
                var body = $(this.contentWindow.document).find('body');
                if (body.length > 0 && $(body).find('*').length > 0) { // check if iframe has contents
                    context.height($(body.get(0)).height() + 20);
                } else {
                    context.hide(); // hide iframes with no contents
                }
            });
        });
    });
</script>