Determinare se un elemento in un iframe è visibile sullo schermo

Devo determinare se un elemento in un iframe è visibile sullo schermo. (Se è sulla parte visibile dello schermo) intendo la pagina può essere molto lungo e utente deve scorrere per visualizzare l'elementoDeterminare se un elemento in un iframe è visibile sullo schermo

index.html:

<html> 
... 
... 
<iframe src="iframe.html" /> 
... 
... 
</html>

iframe.html:

<html> 
... 
... 
<div id="element"></div> 
.... 
... 
<script type="text/javascript"> 
    var el = document.getElementById('element'); 
    if (isElementVisible(el)) { 
     // do something 
    } 
</script> 
</html>

Come scrivere una tale funzione èElementVisible()?

fonte

2013-03-06 varan

Eventuali notizie con questo problema? – Sunyatasattva

Ecco un esempio di ciò che stai cercando di ottenere.

Working example

Just the iframe

In sostanza, questa è la funzione che dovrebbe andare all'interno del vostro iframe:

function isElementVisible(element) 
{ 
    var elementPosition = element.offset().top; 
    var currentScroll = window.parent.$("iframe").contents().scrollTop(); 
    var screenHeight = window.parent.$("iframe").height(); 
    var visibleArea = currentScroll + screenHeight; 
    return (elementPosition < visibleArea); 
}

innescare il vostro controlli un scroll event handler.

$(window).scroll(function(){ 
if(isElementVisible(element)) 
    // Perform your code. 
});

Questo funziona assumendo che l'iframe si trovi nello stesso dominio del frame principale. Io uso jQuery per comodità.

fonte

2013-03-06 15:13:48 Sunyatasattva

Grazie per la soluzione – varan

Che ne dici di gestire più zIndex? Supponiamo che tu abbia 3 iFrames all'incirca nella stessa posizione con diversi zIndexes - come fai a determinare che uno di loro stia bloccando gli altri due? – Elijah

Puoi controllare la proprietà 'z-index' con jQuery, controllare la posizione e' display' o 'visibility' nella tua funzione. Senza vedere il codice è un po 'difficile rispondere, forse puoi pubblicare la tua domanda e pubblicare un link qui, quindi posso dare un'occhiata. – Sunyatasattva

Determinare se un elemento in un iframe è visibile sullo schermo

risposta

Problemi correlati