Come calcolare l'altezza di un iFrame

March 3

Utilizzando IFrame è un modo popolare per incorporare i contenuti da una pagina HTML su Internet in un'altra pagina padre. Ci sono un certo numero di utilizzi per questa tecnica compreso ricarico contenuti chiave senza aggiornare l'intera pagina. Si vuole sapere che l'altezza del iFrame è che se, per esempio, si vuole evitare una barra di scorrimento all'interno della vostra pagina in tutto il iFrame. JavaScript rende calcolare questo valore banale.

istruzione

1 Ottenere un riferimento all'elemento iFrame DOM. Ad esempio, per un iFrame con un id "annidate" si potrebbe scrivere il seguente codice JavaScript:

var DOMElement = document.getElementById ( 'annidate');

2 Accedere alla altezza del iFrame facendo riferimento all'altezza di scorrimento del suo documento interno:

var = frameHeight domElement.contentWindow.document.body.scrollHeight;

Il "frameHeight" variabile ora contiene il numero di pixel di altezza che il iFrame è. Ad esempio, se è stato eseguito il codice qui sopra per un iFrame che è alto 450 pixel, poi corse di questo codice:

alert (frameHeight);

Si otterrebbe una finestra di dialogo pop-up con il numero "450" ​​in esso.

3 Impostare una nuova altezza per l'iFrame accedendo sua proprietà di stile altezza:

domElement.style.height = frameHeight + 100 + 'px';

Questo imposta l'altezza alla vecchia altezza più 100 pixel. Nell'esempio, sarebbe 450 + 100 + 'px'. In JavaScript, che è uguale 550px.

Consigli e avvertenze

  • È inoltre possibile utilizzare le librerie come jQuery per ottenere le dimensioni degli elementi DOM tra cui iFrame.