Come ottenere il valore di posizione superiore div durante lo scorrimento

Question

Sto provando a eseguire alcuni script quando il div raggiunge un determinato punto quando viene fatto scorrere. C'è una navigazione fissa e quando l'utente fa scorrere la finestra suppone di cambiare il nome del navigatore una volta raggiunto vicino al nav. Sto usando la funzione $ (finestra) .scroll ma controlla solo la posizione div una volta e non aggiorno il valore. Come fare scorrere controlla la dimensione della finestra ogni spostamento di 5-10 px in modo che non ci sia troppa memoria/elaborazione. Il codice viene istituito presso: http://jsfiddle.net/rexonms/hyMxq/

HTML

<div id="nav"> NAVIGATION 
    <div class="message">div name</div> 
</div> 
<div id="main"> 
<div id="a">Div A</div> 
<div id ="b"> Div B</div> 
<div id ="c"> Div C</div> 
</div>​ 

CSS

#nav { 
    height: 50px; 
    background-color: #999; 
    position:fixed; 
    top:0; 
    width:100%; 

} 

#main{ 
    margin-top:55px; 
} 
#a, #b, #c { 
    height:300px; 
    background-color:#ddd; 
    margin-bottom:2px; 
} 

SCRIPT

$(window).scroll(function() { 

    var b = $('#b').position(); 

    $('.message').text(b.top); 

    if (b.top == 55) { 
     $('.message').text("Div B"); 
    } 
});​ 

Answer 1

Prova questa jsFiddle example

$(window).scroll(function() { 
    var scrollTop = $(window).scrollTop(), 
     divOffset = $('#b').offset().top, 
     dist = (divOffset - scrollTop); 
    $('.message').text(dist); 
    if (b.top == 55) { 
     $('.message').text("Div B"); 
    } 
});​ 

Il codice originale stava solo controllando la posizione del div relativo alla parte superiore del documento che non cambia mai. È necessario calcolare la quantità di scroll che la finestra ha sostenuto e calcolare di conseguenza.

Nota anche la differenza tra i metodi .position() e 01 di jQuery. Il metodo .position() ci consente di recuperare la posizione corrente di un elemento rispetto al padre di offset. Contrasto con .offset(), che recupera la posizione corrente relativa al documento.